[英]Avoid page reload when submitting form using ajax with laravel
I'm completely stuck trying to process a form submit using ajax instead of laravel to avoid page reload etc. But it isn't working and I don't know why. 我完全不想尝试使用ajax而不是laravel处理表单提交以避免页面重新加载等。但它不起作用,我不知道为什么。 I've searched the wonderful web going through example after example but nothing seems to be working for me.
我通过示例搜索了精彩的网页,但似乎没有什么对我有用。 This is the closest I can get.
这是我能得到的最接近的。 My knowledge is limited but my ambitions are high.
我的知识有限,但我的抱负很高。 Please take a moment and look through my code, beacuse I'm at the edge of mental breakdown right now.
请花一点时间查看我的代码,因为我现在处于精神崩溃的边缘。
Here is my jquery: 这是我的jquery:
$(document).ready(function() {
$('#ajax').submit(function(event){
$.ajax({
type: 'POST',
url: 'comments',
data: $('form#ajax').serialize(),
dataType: 'json',
})
.done(function(data) {
console.log(data);
});
event.preventDefault();
});
});
And here is my form in blade view: 这是我在刀片视图中的表单:
{{ Form::open(array('url'=>'comments', 'id' => 'ajax')) }}
{{ Form::hidden('parent_id', null) }}
{{ Form::hidden('author', Auth::user()->username) }}
{{ Form::textarea('content', null, array('placeholder' => 'Enter your comment here:', 'onfocus' => 'this.placeholder=""')) }}<br/>
{{ Form::submit('Comment', array('class'=>'submit')) }}
{{ Form::close() }}
And here is my controller: 这是我的控制器:
public function createComment() {
//fixa här så man inte kan kommentera tom kommentar
$validate = array('content' => 'required');
$validator = Validator::make(Input::all(), $validate);
if($validator->fails()) {
return Redirect::to('comments')->withErrors($validator)->withInput(Input::all());
}
else {
$comment = new Comment();
$comment->parent_id = Input::get('parent_id');
$comment->author = Input::get('author');
$comment->content = Input::get('content');
$comment->save();
}
}
public function postComment() {
if(Request::ajax()) {
$this->createComment();
return Response::json(Input::all());
}
}
public function getCommentsAndForm() {
$comments = Comment::orderBy('id')->get();
return View::make('comment')->with('comments', $comments);
}
And here is my routes: 这是我的路线:
Route::get('comments', array('uses' => 'CommentController@getCommentsAndForm'));
Route::post('comments', array('uses' => 'CommentController@postComment'));
When I submit the form it dissapears and nothing displays. 当我提交表格时,它会消失,没有任何显示。 If I remove
if(Request::ajax())
the comments get posted but the form still dissapears and instead of an empty page I get the posted comment in JSON. 如果我删除
if(Request::ajax())
,评论会被发布,但表单仍然消失,而不是空页面,我会在JSON中获得发布的评论。 And when I reload the page the comments shows as I want to. 当我重新加载页面时,评论显示为我想要的。 What is the problem?
问题是什么? What am I doing wrong?
我究竟做错了什么? I only want the posted comment to display above my form without reloading the page, is there a solution?
我只希望发布的评论显示在我的表单上方而不重新加载页面,是否有解决方案?
$(document).ready(function() {
$('#ajax').submit(function(event){
event.preventDefault();
$.ajax({
type: 'POST',
url: 'comments',
data: $('form#ajax').serialize(),
dataType: 'json',
})
.done(function(data) {
console.log(data);
});
//just to be sure its not submiting form
return false;
});
});
the important here is to prevent form from submiting. 这里重要的是防止表单提交。 You can try to change submit to button.
您可以尝试将提交更改为按钮。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.