.Net Core Ajax 表单提交不返回非绑定模型属性

Posted 2023-03-31

【中文标题】.Net Core Ajax 表单提交不返回非绑定模型属性

【英文标题】：.Net Core Ajax form submit not returning non binded model property

【发布时间】：2021-07-24 17:34:28

【问题描述】：

我有带有表单 ajax 提交的 .Net 核心 Web 项目。在加载表单时，我将所有属性值设置为视图模型。但是在发布时，它只返回绑定到 html 输入的属性。其他值将变为空。如何获取我传递给表单的所有视图模型属性。

控制器

    public IActionResult General(string templateId)
    
        return View(new TemplateGeneralViewModel  Id = "12-3", Name = "Name", Code = "code" );

    
    [HttpPost]
    public IActionResult General(TemplateGeneralViewModel model)
    
        return View();
    

Cshtml

<form asp-area="AdminPanel" asp-controller="Template" asp-action="General"
      method="post" data-ajax-begin="OnFormAjaxBegin" data-ajax-complete="OnFormAjaxComplete"
      data-ajax-failure="OnFormAjaxFailed" data-ajax-success="OnFormAjaxSuccess"
      data-ajax="true" data-ajax-method="POST">
   
    <div class="form-group">
        <label for="tf1">Id</label>
        <input type="email" asp-for="Id" class="form-control" id="tf1" aria-describedby="tf1Help" placeholder="e.g. [e-mail]">
        <small id="tf1Help" class="form-text text-muted">We'll never share your email with anyone else.</small>
    </div>
    <div class="form-group">
        <label class="form-control-label" for="tfValid">Name</label>
        <input type="text" asp-for="Name" class="form-control is-valid" id="tfValid">
        <div class="valid-feedback"> Success! You've done it. </div>
    </div>
   
</form>

查看模型

public class TemplateGeneralViewModel

    public string Id  get; set; 
    public string Name  get; set; 
    public string Code  get; set; 

这里的属性“代码”在提交时为空。如何在不使用任何隐藏字段的情况下获取此值？

【问题讨论】：

同时添加.cshtml文件代码

【参考方案1】：

请记住，在 Post 操作中返回的模型与在 Get 操作中返回的模型实例不同。使用 html 中存在的数据重新构建。您的 cshtml 中 code 属性的字段在哪里？因此，当重新创建模型以在 post 操作中将其传回时，无法给出任何值。

只需添加字段，如果不想显示，请添加样式以隐藏它

<div class="form-group">
    <label class="form-control-label" for="tfValid">Name</label>
    <input type="text" asp-for="Name" class="form-control is-valid" id="tfValid">
    <div class="valid-feedback"> Success! You've done it. </div>
</div>

<div class="form-group">
    <input type="text" asp-for="code" class="d-none">
</div>

【参考方案2】：

您可以尝试使用asp-route-value 传递查询字符串中的其他数据，您可以参考anchor tag helpers 的官方文档。这是一段将Id、Name 和Code 传递给操作的示例代码：

<form asp-area="AdminPanel" asp-controller="Template" asp-action="General"
      method="post" data-ajax-begin="OnFormAjaxBegin" data-ajax-complete="OnFormAjaxComplete"
      data-ajax-failure="OnFormAjaxFailed" data-ajax-success="OnFormAjaxSuccess"
      data-ajax="true" data-ajax-method="POST" asp-route-Code="@Model.Code">
   
    <div class="form-group">
        <label for="tf1">Id</label>
        <input type="email" asp-for="Id" class="form-control" id="tf1" aria-describedby="tf1Help" placeholder="e.g. [e-mail]">
        <small id="tf1Help" class="form-text text-muted">We'll never share your email with anyone else.</small>
    </div>
    <div class="form-group">
        <label class="form-control-label" for="tfValid">Name</label>
        <input type="text" asp-for="Name" class="form-control is-valid" id="tfValid">
        <div class="valid-feedback"> Success! You've done it. </div>
    </div>
   
</form>