[英]Creating post with ajax in laravel
Hello everyone i'm having some problems with ajax and actually i'm pretty new with jquery and ajax, i have my comment system in laravel, thanks to Stackoverflow community i can edit and update the comments via ajax, however i can create a new comment but with php method only and i'm trying to create new comments with ajax. 大家好,我在使用ajax时遇到一些问题,实际上我在使用jquery和ajax时还很新,我在laravel中使用了注释系统,这要归功于Stackoverflow社区,我可以通过ajax编辑和更新注释,但是我可以创建一个新的注释注释,但仅使用php方法,而我正尝试使用ajax创建新注释。
this is my view: 这是我的看法:
<article class="row">
<div class="col-md-8 col-sm-8">
<div class="panel panel-default arrow left">
<div class="panel-body">
<header class="text-left">
<div class="comment-user"><i class="fa fa-user"></i> {{ $comment->user->name }}</div>
<time class="comment-date" datetime="{{ $comment->created_at->diffForHumans() }}"><i class="fa fa-clock-o"></i> {{ $comment->created_at->diffForHumans() }}</time>
</header>
<div id="comment-post" data-commentid="{{ $comment->id }}">
<p id="display-comment"{{ $comment->id }} class="store-comment">{{ $comment->comment }}</p>
</div>
</div>
<div class="panel-footer list-inline comment-footer">
@if(Auth::guest())
No puedes responder ningún comentario si no has ingresado.
@else
@if(Auth::user() == $comment->user)
<a href="#" data-toggle="modal" data-target="edit-comment" class="edit-comment">Editar</a> <a href="#" data-toggle="modal" data-target="delete-comment" class="delete-comment">Eliminar</a>
@endif
@if(Auth::user() != $comment->user)
<a href="#">Responder</a>
@endif
@endif
</div>
</div>
</div>
</article>
here's my controller method store: 这是我的控制器方法存储:
public function store(Request $request, $post_id)
{
$post = Post::find($post_id);
$this->validate($request, [
'comment' => 'required'
]);
$comment = new Comment();
$comment->comment = $request['comment'];
$comment->save();
return response()->json(['edit_comment' => $comment->comment, $post->id, 'success' => true], 200);
} }
Here's my ajax function: 这是我的ajax函数:
var urlCreate = '{{ url('comments/store') }}';
$('#create').submit(function(){
var comentario = $('#add-comment').val();
$.ajax({
method: 'POST',
url: urlCreate,
data: {comentario: comment, _token: token, _method: 'PUT'},
dataType: 'json'
})
.done(function(message){
if (message.success === true){
$(divcomment).find('.store-comment').text(commentario);
}
});
});
I think this is useful, this is the ajax code that i'm using to update a comment "is working good". 我认为这很有用,这是我用来更新评论的Ajax代码“运作良好”。
var urlEdit = '{{ url('comments/update') }}';
$('.edit-comment').click(function(event){
event.preventDefault();
divcomment = this.parentNode.parentNode;
commentId = $("#comment-post", event.target.parentNode.parentNode).data('commentid');
var commentBody = $(divcomment).find('#display-comment').text();
$('#comment').val(commentBody);
$('#edit-comment').modal();
});
$('#modal-save').on('click', function(){
var $btn = $(this).button('loading');
var comment = $('#comment').val();
$(this).button('loading');
$.ajax({
method: 'PUT',
url: urlEdit,
data: {
comment: comment,
commentId: commentId,
_token: token,
_method: 'PUT',
},
dataType: 'json'
})
.done(function (msg){
if (msg.success === true) {
$(divcomment).find('#display-comment').text(comment);
}
$btn.button('reset');
$('#edit-comment').modal('hide');
success('Comentario editado.', '.alert .alert-success', {timeOut: 5000});
});
});
My goal is to create a new comments without refreshing the whole page. 我的目标是在不刷新整个页面的情况下创建新评论。
UPDATE UPDATE
Token variable: 令牌变量:
var token = '{{ Session::token() }}';
All you need is using serialize
method for data and it is not important to determine dataType
您所需要的只是对数据使用serialize
方法,确定dataType
并不重要
var urlCreate = '{{ url('comments/store') }}';
$('#create').submit(function(){
var comentario = $('#add-comment').val();
$.ajax({
method: 'POST',
url: urlCreate,
data: $("#YourFormId").serialize(),
//dataType: 'json'
success: function(){
// show message and any logic
},
error: function(xhr, status, response){
// In case of error use those params to produce informative message
}
})
Try this: 尝试这个:
var comment = $('#comment').val()
, comment_id = $('#comment-post').data('commentid')
/* , post_id = $('#post_id').val() or {{ $post_id }} if you've passed it along */
, urlEdit = '{{ url('comments/store') }}';
$.ajax({
type:'post',
url:"urlEdit",
data: {
comment: comment,
comment_id: comment_id
},
success:function(data){
/* reload element upon success */
},
error: function(data){
alert("Error Submitting Record!");
}
});
I'm not sure about your Controller. 我不确定您的控制器。 Why would you find Post? 为什么会找到邮政? If the Comment belongs to a certain post (ie your post_id), you may have to include the post_id var in the ajax above if the post_id is a foreign key to your comments table, then do it like so in the controller: 如果Comment属于某个帖子(即您的post_id),则如果post_id是您的注释表的外键,则可能必须在上面的ajax中包含post_id var,然后在控制器中执行以下操作:
public function store(Request $request)
{
$this->validate($request, [
'comment' => 'required'
]);
$comment = new Comment();
$comment->comment = $request->comment;
$comment->comment_id = $request->comment_id;
$comment->post_id = $request->post_id; // only if included
$comment->save();
return response()->json([ 'code'=>200], 200);
}
In the VerifyCsrfToken, place the post url: 在VerifyCsrfToken中,放置发布网址:
protected $except = [
'/comments/store'
];
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.