如何在MVC3中通过ajax调用局部视图

我正在用MVC3开发一个应用程序 我需要显示一个下拉菜单点击部分视图 为此，我写了一个ajax

 $("#UserName").change(function () {
        var userid = $("#UserName").val();
        var ProvincialStateID = $("#State").val();
        var Hobbyid = $("#Hobby").val();
        var Districtid = $("#DistrictNames").val();
        var Homeid = $("#Hobbyhome_EstablishmentId").val();
        var urlperson = '@Url.Action("FetchPersonByUserName")';
        $.ajax({
            type: "POST",
            url: urlperson,
            data: { userid: userid, stateid: ProvincialStateID, hobbyid: Hobbyid, districtid: Districtid, homeid: Homeid },
            success: function (data) {
            }
        });
    });

我在控制器中编写了一个函数，如下所示：

 [HttpPost]
    public ActionResult FetchPersonByUserName(int userid,int stateid,int districtid,int homeid,int Hobbyid)
    {
        //Code to fetch data using all the parameters
        return PartialView("_LearnerAssociationGridPartial", list);
    }

从这里，它进入局部视图，我也可以看到数据
但是当它出现在前端时，我无法看到数据。
请帮助我也许我的ajax可能错了请告诉我哪里错了

这是我的主要观点：

@model HobbyHomesWebApp.ViewModel.LearnerAssociationViewModel
@{
    Layout = "~/Views/Shared/_LayoutPostLogin.cshtml";
}

@using (Html.BeginForm("LearnerAssociation", "Registration", FormMethod.Post))
{
     @Html.ValidationSummary(true)
     <table>
         <div>
             @{Html.RenderPartial("_LearnerAssociationWebPartial", Model.learner);}
         </div> 
     </table>
     <table>
         <div id="result">
             @{Html.RenderPartial("_LearnerAssociationGridPartial", Model.LearnerList);}
         </div>
     </table>
}

@model HobbyHomesWebApp.ViewModel.LearnerAssociationViewModel
@{
Layout=“~/Views/Shared/\u LayoutPostLogin.cshtml”；
}
@使用（Html.BeginForm（“LearnerAssociation”、“Registration”、FormMethod.Post））
{
@Html.ValidationSummary（true）
@{Html.RenderPartial（“_LearnerAssociationWebPartial”，Model.learner）；}
@{Html.RenderPartial（“_LearnerAssociationGridPartial”，Model.LearnerList）；}
}

ajax函数在第一个视图中编写，下拉列表在第一个视图中。
现在，在第一个视图中单击下拉列表，我希望数据显示在第二个视图中的网格中。

我的第一个观点是：

@using (Html.BeginForm("LearnerAssociation", "Registration", FormMethod.Post))
{
  <table>
    <tr>
        <td>
            @Html.Label(@Resources.selectusername)
        </td>
        <td>:</td>
        <td>
        <div class="editor-field">
            @Html.DropDownListFor(model => model.Loginaccount.LoginAccountID, new SelectList(ViewBag.UserName, "LoginAccount.LoginAccountID", "FirstName"), "--Select UserName--", new { @id = "UserName" })
        </div>
        </td>
    </tr>
            </table>

@使用（Html.BeginForm（“LearnerAssociation”，“Registration”，FormMethod.Post））
{
@Html.Label（@Resources.selectusername）
:
@Html.DropDownListFor（model=>model.Loginaccount.LoginAccountID，新选择列表（ViewBag.UserName，“Loginaccount.LoginAccountID”，“FirstName”），“--Select UserName--”，新{@id=“UserName”}）

---

}

编辑：好的，如果我理解正确，您的视图应该如下所示：

@model HobbyHomesWebApp.ViewModel.LearnerAssociationViewModel
@{
    Layout = "~/Views/Shared/_LayoutPostLogin.cshtml";
}

@using (Html.BeginForm("LearnerAssociation", "Registration", FormMethod.Post))
{
     @Html.ValidationSummary(true)
     <table>
         <tr>
         <td>
            <div>
                 @{Html.RenderPartial("_LearnerAssociationWebPartial", Model.learner);}
            </div> 
         </td>
         </tr>
     </table>
     <table>
         <tr>
         <td> 
             <div id="result">

            </div>
         </td>
         </tr>
     </table>
}

---

ActionResult

将返回HTML。在success函数中，您将其指定为

div

编辑：OK的HTML。因此，如果我理解正确，您的视图应该如下所示：

@model HobbyHomesWebApp.ViewModel.LearnerAssociationViewModel
@{
    Layout = "~/Views/Shared/_LayoutPostLogin.cshtml";
}

@using (Html.BeginForm("LearnerAssociation", "Registration", FormMethod.Post))
{
     @Html.ValidationSummary(true)
     <table>
         <tr>
         <td>
            <div>
                 @{Html.RenderPartial("_LearnerAssociationWebPartial", Model.learner);}
            </div> 
         </td>
         </tr>
     </table>
     <table>
         <tr>
         <td> 
             <div id="result">

            </div>
         </td>
         </tr>
     </table>
}

---

ActionResult

将返回HTML。在您的成功函数中，您将此指定为

div的HTML

我希望我了解您想要的内容（如果我不了解，请不要开枪）

让我们假设你有一个标签

<div id="Returned-Content-Container">
</div>

将FormMethod.Post替换为

@using (Html.BeginForm("LearnerAssociation", "Registration", 
        new AjaxOptions() 
                            {
                                HttpMethod = "POST",
                                UpdateTargetId = "Returned-Content-Container",
                                InsertionMode = InsertionMode.Replace
                            })
        {
              // Your form fields go here
        }

它所做的是在返回数据时用ajax调用返回的数据替换定义的标记。自动地

这种方法是用剃须刀引擎来实现的

如果您想用jquery的方式进行，只需执行以下操作：

$("#UserName").change(function () {
    var userid = $("#UserName").val();
    var ProvincialStateID = $("#State").val();
    var Hobbyid = $("#Hobby").val();
    var Districtid = $("#DistrictNames").val();
    var Homeid = $("#Hobbyhome_EstablishmentId").val();
    var urlperson = '@Url.Action("FetchPersonByUserName")';
    $.ajax({
        type: "POST",
        url: urlperson,
        data: { userid: userid, stateid: ProvincialStateID, hobbyid: Hobbyid, districtid: Districtid, homeid: Homeid },
        success: function (data) {
             // This places all data returned into the defined DOM element
             $('#Returned-Content-Container').html(data);
        }
    });
});

希望这有帮助

---

祝你好运

我希望我明白你的意思（如果我不明白，就不要开枪打我）

让我们假设你有一个标签

<div id="Returned-Content-Container">
</div>

将FormMethod.Post替换为

@using (Html.BeginForm("LearnerAssociation", "Registration", 
        new AjaxOptions() 
                            {
                                HttpMethod = "POST",
                                UpdateTargetId = "Returned-Content-Container",
                                InsertionMode = InsertionMode.Replace
                            })
        {
              // Your form fields go here
        }

它所做的是在返回数据时用ajax调用返回的数据替换定义的标记。自动地

这种方法是用剃须刀引擎来实现的

如果您想用jquery的方式进行，只需执行以下操作：

$("#UserName").change(function () {
    var userid = $("#UserName").val();
    var ProvincialStateID = $("#State").val();
    var Hobbyid = $("#Hobby").val();
    var Districtid = $("#DistrictNames").val();
    var Homeid = $("#Hobbyhome_EstablishmentId").val();
    var urlperson = '@Url.Action("FetchPersonByUserName")';
    $.ajax({
        type: "POST",
        url: urlperson,
        data: { userid: userid, stateid: ProvincialStateID, hobbyid: Hobbyid, districtid: Districtid, homeid: Homeid },
        success: function (data) {
             // This places all data returned into the defined DOM element
             $('#Returned-Content-Container').html(data);
        }
    });
});

希望这有帮助

---

---

祝你好运

您似乎没有对从ajax帖子中获得的数据做任何处理。您对ajax成功做了什么？@Saad嘿，当我调试并转到我的部分视图时，数据被提取出来，就像我单击字段一样，我可以看到数据，但调试完成后，当显示页面时，页面上不会显示数据。@Saad否我不需要数据回到这里我只是想从我的控制器功能重定向到视图意味着你想重定向到操作？或者希望在同一页上显示视图？（在任何对话框或div中？）您似乎没有对从ajax帖子中获得的数据做任何处理。您对ajax成功做了什么？@Saad嘿，当我调试并转到我的部分视图时，数据被提取出来，就像我单击字段一样，我可以看到数据，但调试完成后，当显示页面时，页面上不会显示数据。@Saad No act我不需要这里的数据我只是想从我的控制器功能重定向到视图意味着你想重定向到操作？或者希望在同一页上显示视图？（在任何对话框或div中？）Hey thanx是答案，但我不知道该如何应用。我已经回答了我的问题，请看一下。你能添加视图中包含要用于填充PartialView的dropdownlist的部分吗？Hey thanx是答案，但我不知道该如何应用。我已经回答了我的问题，请看看看它。你能添加视图中包含用于填充PartialView的dropdownlist的部分吗？嘿，我尝试了你的jquery，但你能告诉我如何将“数据”从用“urlperson”编写的控制器函数返回到ajax函数。基本上，当你返回PartialView时，它实际上是一个HTML片段。这个HTML代码段应该插入到它的适当位置。嘿，我尝试了你的jquery，但是你能告诉我如何将“数据”从用“urlperson”编写的控制器函数返回到ajax函数。基本上，当你返回一个partialView时，它实际上是一个HTML代码段。这个HTML代码段应该插入到它的适当位置。