Question

我正在开发ASP.Net MVC。我有一个ViewPage SaveStallMenu.cshtml，它有2个DropDown列表（MF Dropdown，Stalls Dropdown）和FilerMenu按钮

第一次加载页面时，它会保留Stall 1的MenuItem。

现在，我的问题是，当我从MF Dropdownlist和Stall DropdownList中选择一个选项，然后点击过滤菜单按钮时，<div id="partialViewDiv"></div>中的内容应该与菜单项相关的刷新到档位选择。

我为此目的使用AJAX。

单击FilterMenu按钮时

 @using (Ajax.BeginForm("uppendStallData", "Admin", new AjaxOptions { HttpMethod = "POST", InsertionMode = InsertionMode.Replace, LoadingElementId = "", UpdateTargetId = "partialViewDiv" }))
            {
}

这应该将我的表单提交给uppendStallData ActionMethod，但我不知道它为什么不起作用。

请原谅我，如果你在我的问题解释中发现了缺陷。请尝试浏览我的代码并提供指导。

我尝试了很多解决方案，因为你可以看到下面的脚本，但没有得到我想要做的事情。

试用1： 如果我使用上述Ajax.BeginForm，则uppendStallData无法获取已发布的ViewModel数据。

[HttpPost]
public PartialViewResult uppendStallData(AdminVM VM)
{ 

    List<StallsModel> data = _provider.GetStallsList();
    VM.StallNameDDl = data.ToDictionary(x => x.StallId, x => x.StallName);

    List<MFDetailsModel> data1 = _provider.GetMFDetailsList();
    VM.MFNameDDl = data1.ToDictionary(x => x.Id, x => x.MFName);

    long MFID1 = Convert.ToInt64(VM.StallMenuModel.MFId);

    long STallId = Convert.ToInt64(VM.StallMenuModel.StallId);

    VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);   

    return PartialView("_MenuTabs", VM);

}

试用2： 如果我打电话给如下所示，请在FilterMenu按钮上单击，此脚本将下拉列表选定值发送到uppendStallData，但在成功执行Contoller中的方法后，无法返回PartialView并附加到<div id="partialViewDiv">。

使用Trial2，我的脚本和控制器方法如下，

<script>
    $('#Filter').click(function () {
        var MF_Id = $('#StallMenuModel_MFId').val();
        var Stall_Id = $('#StallMenuModel_StallId').val();

        $.ajax({
            url: '@Url.Action("uppendStallData", "Admin")',
            data: { MFID: $("#StallMenuModel_MFId").val(), STID: $("#StallMenuModel_StallId").val() },
            type: 'POST',
            success: function (data) {
                $("#partialViewDiv").html(data);
            }
        });
    });
</script>

控制器

         public PartialViewResult uppendStallData(string MFID,string STID)
         {


             List<StallsModel> data = _provider.GetStallsList();
             VM.StallNameDDl = data.ToDictionary(x => x.StallId, x => x.StallName);

             List<MFDetailsModel> data1 = _provider.GetMFDetailsList();
             VM.MFNameDDl = data1.ToDictionary(x => x.Id, x => x.MFName);


             long MFID1 = Convert.ToInt64(MFID);

             long STallId = Convert.ToInt64(STID);

             VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);    
             return PartialView("_MenuTabs", VM);
         }

这是控制器代码：

[HttpGet]
public ActionResult SaveStallMenu()
{
    AdminVM VM = new AdminVM();
    List<StallsModel> data = _provider.GetStallsList();
    VM.StallNameDDl = data.ToDictionary(x => x.StallId, x => x.StallName);

    List<MFDetailsModel> data1 = _provider.GetMFDetailsList();
    VM.MFNameDDl = data1.ToDictionary(x => x.Id, x => x.MFName);
    VM.StallMenuModel = new StallMenuModel();


    VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(1);                     
    return View(VM);
}


[HttpPost]
public PartialViewResult uppendStallData(string MFID,string STID)
{

    List<StallsModel> data = _provider.GetStallsList();
    VM.StallNameDDl = data.ToDictionary(x => x.StallId, x => x.StallName);

    List<MFDetailsModel> data1 = _provider.GetMFDetailsList();
    VM.MFNameDDl = data1.ToDictionary(x => x.Id, x => x.MFName);


    long MFID1 = Convert.ToInt64(MFID);

    long STallId = Convert.ToInt64(STID);

    VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);    
    return PartialView("_MenuTabs", VM);

}

Answer 1

非常感谢您的即时回复。这是我的问题的答案。

<强> SaveStallMenu.cshtml

<div class="col-lg-4">
         <div class="form-group form-group-select2">
            <label style="font-size:15px;font-weight:bold;">Select MF Name</label>
           @Html.DropDownListFor(model => model.StallMenuModel.MFId, new SelectList(Model.MFNameDDl, "Key", "Value", "--- Select ---"), new { @onchange = "FillService()", @class = "form-control" })
           @Html.ValidationMessageFor(model => model.StallMenuModel.MFId, "", new { @class = "text-danger" })
         </div>
</div>

<div class="col-lg-4">
     <div class="form-group form-group-select2">
         <label style="font-size:15px;font-weight:bold;">Select Stall Name</label>
       @Html.DropDownListFor(model => model.StallMenuModel.StallId, new SelectList(Model.StallNameDDl, "Key", "Value", "--- Select ---"), new { @class = "form-control" })
       @Html.ValidationMessageFor(model => model.StallMenuModel.StallId, "", new { @class = "text-danger" })
    </div>
</div>

<div class="col-lg-4" style="float:right;">
    <div class="form-group form-group-select2">
           <input type="submit" value="Filter Menu" id="Filter" class="btn btn-success" style="margin-top:25px;float:right;" />
     </div>
</div>

    <div id="partialViewDiv"></div>

    <script>
        $('#Filter').click(function () {
            var MF_Id = $('#StallMenuModel_MFId').val();
            var Stall_Id = $('#StallMenuModel_StallId').val();

            $.ajax({
                url: '@Url.Action("uppendStallData1", "Admin")',
                data: { MFID: $("#StallMenuModel_MFId").val(), STID: $("#StallMenuModel_StallId").val() },
                type: 'POST',
                success: function (data) {
                    $("#partialViewDiv").html(data);
                }
            });
        });
    </script>

控制器代码：

[HttpPost]
public PartialViewResult uppendStallData1(string MFID, string STID)
{
    AdminVM VM= new AdminVM();

    long MFID1 = Convert.ToInt64(MFID);
    long STallId = Convert.ToInt64(STID);

    List<StallsModel> data = _provider.GetStallsList();
    VM.StallNameDDl = data.ToDictionary(x => x.StallId, x => x.StallName);

    List<MFDetailsModel> data1 = _provider.GetMFDetailsList();
    VM.MFNameDDl = data1.ToDictionary(x => x.Id, x => x.MFName);             

    VM.CompleteMenuByStallIDList = _provider.GetCompleteMenuByStallId_List(STallId);
    return PartialView("_MenuTabs", VM);
}

如何根据MVC中的DropDownList选择刷新页面的一部分？

1 个答案: