如何将MVC视图返回给JQuery成功后的委托

本文关键字:成功 JQuery MVC 视图 返回 | 更新日期: 2023-09-27 18:30:05

我有以下JQuery方法,用于将数据发布到MVC控制器中的操作:

$('#btnAddNewTest').on("click", function () {
    var date = $('#HIVTestTestDate').val();
    var result = $('#HIVTestTestResult').val();
    var cd4 = $('#HIVTestCD4Count').val();
    var pID = $('#PatientID').val();
    var dataToSend = { patientID: pID, testDate: date, resultID: result, cd4Count: cd4 };
    $.post("/HIVInformation/AddHIVTest/", dataToSend, function (receivedData) {
        location.reload(false); //Don't want to do this
    });
    return false;
});

以下是我的控制器中的操作方法:

[HttpPost]
    public ActionResult AddHIVTest(Guid patientID, DateTime testDate, Guid resultID, int cd4Count)
    {
        MvcPatientDetailsHIVViewModel model = new MvcPatientDetailsHIVViewModel(patientID);
        model.LoadAllData();
        try
        {
            //add the HIV Test
            model.HIVTestResult = new Common.Models.PatientHIVTestModel()
            {
                ID = Guid.NewGuid(),
                PatientID = patientID,
                TestDate = testDate,
                HIVTestResultID = resultID,
                CD4Count = cd4Count
            };
            //call the add method
            model.AddHIVTestResults();
        }
        catch (Exception ex)
        {
            ModelState.AddModelError("", ex);
        }
        return View("Details", model);
    }

如果我注释掉"location.reload(false);",我的页面不会刷新。如何序列化要在帖子的function (receivedData)委托中返回的Mvc视图?然后如何在JQuery代码中显示我的视图?

如何将MVC视图返回给JQuery成功后的委托

如果可以的话,我建议您使用ajax、局部视图和容器div将结果加载到其中。

示例:

脚本:

$(document).ready(function () {
        $("#btnAddNewTest").on("click", function () {
            $.ajax({
                url: '@Url.Action("YourAction", "YourController")',
                type: 'post',
                data: {
                    yourData1: value1,
                    yourData2: value2,
                },
                success: function (result) {
                    $('#dynamicContent').html(result);
                }
            });
        });
    });

控制器:

 public ActionResult YourAction(int yourData1= 1, int yourData2 = 0)
        {
            return PartialView("~/yourviewPath/_YourPartialView.cshtml", yourResultModel)
        }

Html:

<div id="dynamicContent" class="Float_Clear">
    @Html.Partial("~/yourviewPath/_YourPartialView.cshtml", Model)
</div>

我在这里使用相同的概念创建的实际示例