成功发布后如何在不刷新页面的情况下更新页面内容

Question

我有一个MVC应用程序，这是我的ajax代码。 我希望我的页面内容自动更新，而不会在成功后刷新页面。我看了很多文章，但找不到对我有用的东西。 我有一个JStree，成功节点名称自动在树中更新而没有刷新页面后，我想在其中创建一个新节点。

$(".btn").click(function () {                  
                    var check = $(".newName").val();                   
                    if (check != "") {
                        $.ajax({
                            url: '@Url.Action("EditUserProfile", "Home")',
                            type: "POST",
                            cache: false,
                            data:{ folder:Name,subId:id},
                            success: function (data) {

                            }
                        });
                        e.preventDefault();
                    }

Answer 1

尝试用jquery load() ，

$('#treeDivBlock').load(" #treeDivBlock", function() { 
     $(this).children().unwrap();
});

Answer 2

您可以不刷新而更新页面内容：

1. 确保Home控制器中的方法EditUserProfile具有足够的参数，并且它们与ajax方法具有相同的名称。 在这种情况下，它们是： folder和subId 。

2. 删除window.location.reload(); 并获取data.result以检查响应是否成功。

3. 请查看我的代码：

视图

$.ajax({ url: '@Url.Action("EditUserProfile", "Home")', type: "POST", cache: false, data: { folder: Name, subId: id }, success: function(data) { if (data.result == true) // or something { // success } else { // fail } } });

控制者

public JsonResult EditUserProfile(string folder, string subId) {
    // do something

    return Json(new {
        result = true; // false or anything else
    });
}

原因是您不对HTML上的数据显示进行任何操作。 Ajax只是帮助您在Controller中调用方法，而不为您编辑当前显示数据。

所有您需要做的：

• 分配包含ID的数据的行

• 在Ajax返回成功值之后，使用Jquery更新该行的内容。