更新视图另一部分的ListBox
本文关键字:ListBox 一部分 另一部 新视图 更新 | 更新日期: 2023-09-27 17:57:26
我想要一个ListBox,它在提交时会将其选定的值发送到一个控制器,该控制器的响应将用于更新视图的一小部分。
以下代码可以更新视图的一部分,并获取选定的值,但只能单独使用。在更新页面的一部分时,我无法从ListBox中获取值:
能够将所选值返回到控制器的代码:
public ActionResult GetInput(ListBoxModel mod)
{
OtherModel data = new OtherModel();
data.selected = mod;
return View("HomePage", data);
}
@model App.Models.MainViewModel
@using(Html.BeginForm("GetInput", "Home", FormMethod.Post))
{
<label for="optionList">Options:</label>
@Html.ListBox("optionList", Model.listBoxMod.list)
<input type="submit" value="Submit"/>
}
此代码可以更新部分页面,但无法从ListBox获取数据:
public ActionResult GetInputAndUpdate(ListBoxModel mod)
{
//get values out of mod and put them in NewList selectedValues
//but no values appear in mod
//I can put fake data in selectedValues and it will be put on the page
return PartialView("PartialViewUpdate", selectedValues);
}
主视图:
@model App.Models.MainViewModel
@using(Html.BeginForm("GetInputAndUpdate", "Home", FormMethod.Post))
{
<label for="CGSelected">Care Gaps:</label>
@Html.ListBox("CGSelected", Model.listBoxMod.list)
<input id="submitButton" data-url="@Url.Action("GetInputAndUpdate")" type="submit" value="Submit" />
<!-- <input id="loadFromMainFrame" data-url="@Url.Action("CareGapSubmitInit", Model ??? )" type="submit" value="Submit" /> This doesn't work! -->
//The partial view html gets put here
<div id="selectedValuesItem"></div>
}
局部视图:
@model App.Models.NewList
@foreach(var str in Model)
{
@str
<br />
}
更新部分视图的代码:
$(function ()
{
$("#submitButton").click(function (e)
{
e.preventDefault();
var url = $(this).data("url");
$("#selectedValuesItem").load(url);
});
});
如果您想调用GetInputAndUpdate
$(function ()
{
$("#submitButton").click(function (e)
{
e.preventDefault();
var url = "@Url.Action("GetInputAndUpdate")?selectedValue=" + $("#optionList").val();
$("#selectedValuesItem").load(url);
});
这个
public ActionResult GetInputAndUpdate(ListBoxModel mod)
变成这个
public ActionResult GetInputAndUpdate(string selectedValue)
我得到了某人的帮助,正确的方法如下:
@using(Ajax.BeginForm("GetInput", "Home", new AjaxOptions{UpdateTargetId = "selectedValuesItem"}))
{
<label for="optionList">Care Gaps:</label>
@Html.ListBox("optionList", Model.listBoxMod.list)
<input type="submit" value="Submit" />
}
然后将此脚本包含在项目中,如下所示:@Scripts.Render("~/Scripts/jquery.inobstructrajax.js")
这将在ListBox中返回正确的Model/selected项,响应视图.html将放在selectedValuesItem分区中。它也可以在多选框中工作。