“未定义”使用Ajax和Laravel更新或删除新的评论

时间:2017-12-09 03:55:19

标签: php ajax laravel

当我创建一个新的评论它显示良好,但我无法编辑或删除,要做到这一点,我必须先刷新页面..原因?在console =“Undefined”..当一个创建后重新生成整个带有新评论数据的html时,看起来它没有给我新评论的ID ..就像我说我必须刷新页面进行编辑或删除新评论。

这是我重新生成和创建新评论的方式:

的Ajax:

$('.send').click(function(e){
   e.preventDefault();
   var dataSerialize = $('#add-comment').serialize();
   var $btn = $(this).button('loading');
   $.ajax({
      method: 'post',
      url: urlPostComment,
      data: dataSerialize,
      dataType: 'json', // <- La coma
      success: function (data) {
         console.log(data); // <- Revisar JSON en la consola del navegador
         if( data.success )
         {
           $('#post-comments').append(
'<section class="comment-list'+data.id+'"><article class="row"><div class="col-md-2 col-sm-2 hidden-xs"><figure class="comment-list-image"><img class="img-responsive img-circle" src="/uploads/avatars/'+data.picture+'"/></figure></div><div class="col-md-9 col-sm-9"><div class="panel panel-default"><div class="panel-body"><header class="text-left"><div class="comment-user"><i class="fa fa-user"></i> '+data.name+' '+data.lastname+' <time class="comment-date p-l-10"><i class="fa fa-clock-o"></i> '+data.timestamp+'</time></div></header><div id="comment-post" data-commentid="'+data.id+'"><p id="display-comment" class="store-comment p-t-10">'+data.comment+'</p></div></div><div class="panel-footer list-inline comment-footer"><a href="#" data-toggle="modal" data-target="edit-comment" class="edit-comment" value="'+data.id+'" data-name="'+data.comment+'">Editar</a> <a href="#" data-toggle="modal" data-target="delete-comment"class="delete-comment" data-id="'+data.id+'" data-name="'+ data.comment+'">Eliminar</a></div></div></div></article></section>'
          );

            toastr.success('Comentario enviado.', '', {timeOut: 7000})
            $('#comment-new').val('');

         }
         else {
           toastr.warning(" "+ data.message +" ", '', {timeOut: 7000})
         }

      }, // <- La coma
      error: function () {
        toastr.warning('No hemos podido enviar el comentario, intenta nevamente.', '', {timeOut: 7000})
      }, // <- La coma
      complete: function () {
        $btn.button('reset');
      }
   });
});

这是我在控制器中的创建功能:

public function store(Request $request, $post_id)
{
  if(!$request->has('comment') || empty($request->comment))
  {
    return response()->json([
      'message' => 'No puedes enviar un comentario vacío.',
      'success' => false
    ]);
  }

  $post = Post::find($post_id);
  $comment = new Comment();
  $comment->comment   = $request->comment;
  $comment->approved  = true;
  $comment->user_id   = auth()->id();
  $comment->user->profilepic = $comment->user->profilepic;
  $comment->post_id   = $post_id;
  $comment->save();
  return response()->json([
    'comment' => $comment->comment,
    'user_id' => $comment->user_id,
    'post_id' => $comment->post_id,
    'picture' => $comment->user->profilepic,
    'name'    => $comment->user->name,
    'lastname' => $comment->user->last_name,
    'timestamp' => $comment->created_at->diffForHumans(),
    'post_slug' => $post->slug,
    'success' => true
  ]);
}

我想知道在编写新的html时是否存在字符限制。我重新获得了整个代码,但我不知道,我需要减少一些代码行,因为部分代码之前没有突出显示..

1 个答案:

答案 0 :(得分:0)

我猜是因为你没有在你的javascript中使用document 在你所有的ajax请求中试试这个:

$(document).on('click', '.send', function(e){
    //your ajax code
});

并更新或删除方法:

$(document).on('click', '.edit', function(e){
    //your ajax code
}); 

$(document).on('click', '.delete', function(e){
    //your ajax code
});