对于MVC,JavaScript和jQuery,我仍然很陌生,请耐心等待。
我有一个webgrid包含不同的术语和他们的翻译。术语列表取决于从网格上方的下拉列表中选择的'VMID'。 (或者至少应该是,如果它工作正常)。
最左边的列有一个编辑链接,用于导出Boostrap模态的每个术语,其中填充了分配给所选ID中的所有值下拉列表。我需要网格中的术语也取决于从该列表中选择的值。
目前我想的方法是这样的(仅粘贴相关的问题位) -Webgrid需要使用MVC中的新内容进行更新
主视图(模型参考,不包含强类型):
<div class="container-fluid">
<div style=" margin-bottom: 1.4%;">
<table>
<tr>
<td style="font-size: medium; margin-bottom: 5px">
@Model.lblVMID:
</td>
<td>
@Html.DropDownListFor(model => model.VMID, new System.Web.Mvc.SelectList(Model.locations, "Key", "Value"), new { @class = "form-control", id = "ddlVMID", onchange = "RepopGrid()" })
</td>
</tr>
</table>
</div>
<div class="table-scrollable well" id="termGrid">
@{Html.RenderPartial("_TermGrid", Model);}
</div>
</div>
<script type="text/javascript">
function RepopGrid() {
VMID = $("#ddlVMID").val();
ShowLoadingDialog();
$.ajax({
url: URLPrefix() + "/Terminology/RepopGrid/" + VMID,
type: "POST",
success: function() {
HideLoadingDialog();
},
error: function (jqXHR, textStatus, errorThrown) {
HideLoadingDialog();
ShowAlert(false, 'Failed to change location\r\n' + errorThrown);
}
})
}
</script>
局部视图(强与模型参考,不包括主视图使用相同的模型类型):
@Model.grid.GetHtml(columns: Model.columns, alternatingRowStyle: "info", nextText: "Next",
previousText: "Previous", tableStyle: "table")
控制器:
public ActionResult Index()
{
TerminologyModel model = new TerminologyModel(clsUtils.PreferredVMID());
return View(model);
}
[HttpPost]
public ActionResult RepopGrid(int VMID)
{
TerminologyModel model = new TerminologyModel(VMID);
return PartialView("_TermGrid", model);
}
模型接受'int VMID'并使用它从数据库检索术语列表,然后foreach遍历每个术语并将它们分配给网格。这工作正常,所以我不需要在这里发布它(这有点长,因为有一些特殊的列需要额外的工作才能设置)。
我们有将URL映射到控制器及其相应的行动,在这种情况下,路由配置文件:
routes.MapRoute(
name: "TerminologyRepopGrid",
url: "Terminology/{action}/{VMID}",
defaults: new { controller = "Terminology", action = "RepopGrid", VMID = UrlParameter.Optional }
);
我不熟悉使用Ajax,所以我可能用它完全错误的。
这种方法基于一些地方,我已阅读将网格放在部分视图中,所以这就是我在这里所做的。
当我选择一个新选项后,我可以看到Chrome的元素检查器正在返回一个全新的网格,但该网格并未在现有网格上应用。 同样,我一直在寻找和尝试,阅读和试验,我只是不知道为什么我的工作不起作用。