如何解决SelectList不返回文本值仅返回ID 查看代码段模型片段控制器代码段
我对ASP Net Core还是很陌生,并试图在将值从视图传递到控制器时实现选择列表。其他所有工作都正常,我面临的唯一问题是仅将ID传递给控制器,而不传递文本/名称。 谁能告诉我我要去哪里错了?下面是我的代码。
查看代码段
<div class="form-group">
<label>Financial Year</label>
<select asp-for="FinancialYear" asp-items="ViewBag.FinancialYear" class="selectpicker" data-dropup-auto="false" data-size="5">
</select>
</div>
模型片段
public class VMOM
{
public int FinancialYear { get; set; }
}
public class VMDropDown
{
public int ID { get; set; }
public string Text { get; set; }
}
控制器代码段
[HttpGet]
public IActionResult Create()
{
VMOM vmOM = new VMOM();
ViewBag.FinancialYear = new SelectList(GetFinancialYearList(),"ID","Text",0).ToList();
return View(vmOM);
}
[HttpPost]
public IActionResult Create(VMOM vmOM)
{
return View(vmOM);
}
private List<VMDropDown> GetFinancialYearList()
{
List<VMDropDown> vmDropdowns = new List<VMDropDown>
{
new VMDropDown() { ID = 1,Text = "2019" },new VMDropDown() { ID = 2,Text = "2020" }
};
return vmDropdowns;
}
在动作方法中接收到的值的SS;请注意,在财政年度中,仅显示当年的ID,而不显示文本值,即2020
解决方法
最简单的方法是将ID值更改为与Text相同。
List<VMDropDown> vmDropdowns = new List<VMDropDown>
{
new VMDropDown() { ID = 2019,Text = "2019" },new VMDropDown() { ID = 2020,Text = "2020" }
};
,
如果您不介意使用JavaScript,则可以轻松实现所需的功能。
我们添加了一个隐藏的输入字段,其值在select
更改时进行了更新。
因此,当我们提交表单时,隐藏的输入值将被提交并与我们的模型绑定(请参见下面的屏幕截图)。
剃刀:
<form asp-action="Post" method="post">
<select class="form-control" asp-items="@ViewBag.List" asp-for="@Model.Id" id="FYear">
</select>
<input type="hidden" id="FYearText" asp-for="@Model.Year" readonly="readonly" hidden/>
<button type="submit" class="btn btn-success">Submit</button>
</form>
型号
public class VMOM
{
public int Id { get; set; }
public string Year { get; set; }
}
控制器:
[HttpGet]
public IActionResult Index()
{
var data = new List<VMOM> {
new VMOM { Id = 1,Year = "2018" },new VMOM { Id = 2,Year = "2019" },new VMOM { Id = 3,Year = "2020" },new VMOM { Id = 4,Year = "2077" }
};
ViewBag.List = new SelectList(data,"Id","Year");
return View("Index",new VMOM());
}
JS
$(document).ready(function(){
$("#FYear").on("change",function(){
$("#FYearText").val($(this).find("option:selected").text());
});
});
结果:
P.S,为简洁起见,我在此示例中使用jQuery。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。