Javascript 如何加载特定的div或id ajax和laravel

我在laravel的应用程序上有一个评论系统，我可以用ajax编辑我的评论，但编辑后不会自动加载编辑后的评论。要查看编辑的注释，我需要手动重新加载页面。我将把一些代码放在这里

这是JS：

var commentId=0；
var-divcomment=null；
$（'.edit comment'）。单击（函数（事件）{
event.preventDefault（）；
/*小组成员*/
var divcomment=this.parentNode.parentNode；
/*Buscamos el Contenido con Id显示文本*/
commentId=$（“#评论文章”，event.target.parentNode.parentNode）。数据（'commentId'）；
var commentBody=$（divcomment）.find（'#display comment'）.text（）；
$（'#comment'）.val（commentBody）；
$（“#编辑注释”）.modal（）；
/*阿西尼亚*/
});
$（“#模式保存”）。在（'click'，function（）上{
$.ajax({
方法：'放'，
url:urlEdit，
数据：{
注释：$（“#注释”）.val（），
commentId:commentId，
_令牌：令牌，
_方法：'放'，
数据类型：“json”，
}
})
.done（函数（msg）{
$（divcomment）.text（msg['new_comment']）；
$（“#编辑注释”）.modal（'hide'）；
});
});

这是Html：

@恩迪夫
@如果（Auth:：user（）！=$comment->user）
@恩迪夫
@恩迪夫

在视图上创建的2个变量

  var token = '{{ Session::token() }}';
  var urlEdit = '{{ url('comments/update') }}';

最后是我编辑评论的模式：

&时代；
埃迪塔·科曼塔里奥
埃迪塔·科曼塔里奥
塞拉
编辑

---

一切正常，但我唯一需要的是加载编辑后的评论而不刷新整个页面，顺便说一句，我使用了$（'display comment'）.load（document.URL+'display comment'）；通过这一行，我成功地加载了已编辑的注释，但它加载了已编辑注释上的所有注释，因此我必须刷新整个页面以仅显示已编辑的注释。

假设发送到事物的php端的数据与您随后要更新的数据相同，则以下操作应该有效：

$('#modal-save').on('click', function(){
    var comment = $('#comment').val();
    // shove the edited comment into a variable local to the modal handler
    $.ajax({
        method: 'PUT',
        url: urlEdit,
        data: {
            comment: comment, // reference said variable for ajax data
            commentId: commentId,
            _token: token,
            _method: 'PUT'
         },
         dataType: 'json'
    })
    .done(function (msg){
        //$(divcomment).text(msg['new_comment']);
        // I commented out the above line as it clears the
        // divcomment div's text entirely.
        // Comment out the below 'if check' if it is not needed.
        if (msg.success === true) {
            $(divcomment).find('#display-comment').text(comment);
            // And overwrite the #display-comment div with the new
            // data if the user was successful in editing the comment
        }
        $('#edit-comment').modal('hide');
    });
});

在一个示例中，您在处理ajax的php端有一个控制器方法。您应该返回json来指示操作是否成功，而不是重定向（因为它是ajax，没有重定向）。以下是一个例子：

public function update(Request $request)
{

    //...

    $comment = Comment::find($request['commentId']);
    if (Auth::user() != $comment->user) {
        return response()->json(['success' => false], 200);
    }

    //...

    return response()->json(['new_comment' => $comment->comment, 'success' => true], 200);
}

我在javascript方面的回答中引用了上述json；如果您不打算使用json响应，那么只需注释掉该行（正如我在代码中也提到的）

更新： 我在你之前的代码块中遗漏了一些东西；在编辑链接的处理程序外部声明

divcomment

，然后在该处理程序内部再次声明。我在前面的回答中忽略了这一点，因此只需从中删除

var

，它就使用了外部声明，修复了您的代码：

var commentId = 0;
var divcomment = null; //this is already declared, no reason to declare it
// again

$('.edit-comment').click(function(event){
    event.preventDefault();
    /* Accedemos al Div Que contiene el Panel*/
    divcomment = this.parentNode.parentNode;
 // ^ remove the var, making this use the global variable you already
 // made above
    /* Buscamos el Contenido con Id display-text  */
    commentId = $("#comment-post", event.target.parentNode.parentNode).data('commentid');
    var commentBody = $(divcomment).find('#display-comment').text();
    $('#comment').val(commentBody);
    $('#edit-comment').modal();
    /* Asignas a tu modal */
});

---

你有来自模态的评论；您是否有理由不能使用模型中包含的数据？这是相同的数据，不是吗？@Daedalus这是这样工作的，模态包含注释id，然后我编辑注释，一旦编辑，注释应该通过模态传递到id=“display comment”。因此，理论上，模式中的数据应该替换旧的id=“display comment”数据。。或者至少这就是我想要的。那么，你为什么不能这么做呢<代码>$（divcomment）.find（“#display comment”）.text（comment），作为ajax的done函数的最后一行。另外，请停止对非代码段代码使用代码段功能。如果您只有要缩进的代码，请使用大括号按钮：

{}

，而不是snippet按钮，该按钮用于演示可运行的javascript、css或html代码。有关详细信息，请参阅。@Daedalus对代码段功能感到抱歉，我是新来的。关于代码，同样，我需要手动重新加载页面，以查看编辑的注释不会自动加载注释。。。我不知道还能做什么@Daedalus@JuanRinc如果没有任何错误，或者更好地描述问题，我也不知道。没有错误。这是chrome控制台给我的：

{new_comment:“Primer Comentario editado…”，success:true}new_comment:“Primer Comentario editado…”success:true

和表单数据：

comment:Primer Comentario editado。。。commentId:1 _token:6llgVyfmAstqHEuVpnrXpS4hg0u8yRHfnaoD9ff5 _method:PUT dataType:json

@JuanRincón请显示控制台的屏幕截图；否则就不清楚如何在json中获得两个对象。[link]（title=“source:imgur.com”/>）[link2]（title=“source:imgur.com”/>）[link3]（=“title=“source:imgur.com”/>）@Daedalus