数据表(视图)未刷新在MVC中的jQuery Ajax后

时间:2018-07-12 06:02:00

标签: asp.net asp.net-mvc asp.net-mvc-4 model-view-controller

刷新MVC中使用Ajax发布的数据时,我面临以下问题。 POST已成功执行,但是VIEW上的数据未用新数据刷新。当我调试时,来自Ajax POST的值已成功传递到我的控制器。当控制器返回视图模型return View(objLMT);时,我的VIEW没有刷新新数据。如何获取新数据以显示在VIEW中?

AJAX

function getAllUserRoleCompany() {
    debugger

    var url = '@Url.Action("GetAllUserRoleCompany", "UserRoleCompany")';

    var Organisation = $("#Organisation").val();

    if (Organisation == "All") {
        Organisation = "";
    }
    else {
        Organisation = Organisation;
    }

    var RoleName = $("#RoleName").val();

    if (RoleName == "All") {
        RoleName = "";
    }
    else {
        RoleName = RoleName;
    }

    var i = 0;
    if ($("#UserName").find("option:selected").length >= 0) {
        var len = $("#UserName").find("option:selected").length;
    }
    else {
        len = 0;
    }


    var UserName = "";



    for (; i < len; i++) {
        if ($("#UserName").find("option:selected")[i].text != "All") {
            if (i == 0) {
                UserName = "',";
            }

            if (i < len - 1) {
                UserName += $("#UserName").find("option:selected")[i].text + ",";
                UserName = UserName.substring(0, UserName.indexOf("-")) + ",";
            }
            else {
                UserName += $("#UserName").find("option:selected")[i].text + ",'";
                UserName = UserName.substring(0, UserName.indexOf("-")) + ",'";
            }
        }
    }

    if (UserName == "All") {
        UserName = ""
    }
    else {
        UserName = UserName;
    }

    var UserStatus = $("#UserStatus").val();

    if (UserStatus == "All") {
        UserStatus = "";
    }
    else {
        UserStatus = UserStatus;
    }

    $.ajax({
        url: url,
        data: { Organisation: Organisation, RoleName: RoleName, UserName: UserName, UserStatus: UserStatus },

        cache: false,
        type: "POST",
        success: function (data) {
            //$("#dataTables-example").bind("");
            //$("#dataTables-example").bind();
            //location.reload(true);

        },
        error: function (reponse) {
            alert("error : " + reponse);
        }
    });

以下是同一页面上的查看代码

<div class="row">
@Html.Partial("pv_UserRoleCompany", Model)

enter image description here

控制器

  public ActionResult GetAllUserRoleCompany(String Organisation, String RoleName, String UserName, int UserStatus)
    {
        LMTUsage objLMT = new LMTUsage();
        LMTDAL objLMTDAL = new LMTDAL();

        string usrNameWithDomain = System.Web.HttpContext.Current.User.Identity.Name;
        //string userID = "261213";  // Environment.UserName;
        string userID = "100728";

        ViewBag.UserRoleId = objLMTDAL.GetRoleID(userID);
        objLMT.TypeList = objLMTDAL.UserRoleCompany_GetAll(Organisation, RoleName, userID, ViewBag.UserRoleId, UserName, UserStatus);

       // return Json(objLMT, JsonRequestBehavior.AllowGet);
        return PartialView("pv_UserRoleCompany", objLMT);
    }

使用上述代码,我在SEARCHING或UPDATING视图中的表/网格未刷新。 请帮助。

3 个答案:

答案 0 :(得分:0)

如果您要通过AJAX调用返回部分视图,则必须使用jQuery“刷新”数据。

在您的js代码中,您可以执行以下操作:

$.ajax({
    url: url,
    data: { Organisation: Organisation, RoleName: RoleName, UserName: UserName, 
            UserStatus: UserStatus },
    cache: false,
    type: "POST",
    success: function (data) {
        //$("#dataTables-example").bind("");
        //$("#dataTables-example").bind();
        //location.reload(true);
        $("#dataTables-example").html(data);
    },
    error: function (reponse) {
        alert("error : " + reponse);
    }
});

这将用控制器中部分视图结果中的HTML替换现有的HTML。

答案 1 :(得分:0)

@Mihail我已经尝试使用上述解决方案。它有效,我的意思是刷新了我的视图,但没有按预期完全加载我的视图。

之前查看(预期) enter image description here

使用$(“#dataTables-example”)。html(data);之后查看 enter image description here

答案 2 :(得分:0)

尝试一下是否适合您 根据您的呼叫调用此函数:

function getAllUserRoleCompany(parameters) {
    var token = $('[name=__RequestVerificationToken]').val();
    $.ajax({
        type: "POST",
        url: '/UserRoleCompany/GetAllUserRoleCompany',
        data: { Organisation: Organisation, RoleName: RoleName, UserName: UserName, UserStatus: UserStatus },
        dataType: 'html',
        success: function (data) {
            $("#").empty().html(data);

        }
    });

}