Asp.net mvc 使用多个选项卡验证MVC表单

Asp.net mvc 使用多个选项卡验证MVC表单,asp.net-mvc,razor,Asp.net Mvc,Razor,我有一个表格,有几个标签,我需要验证。这就是我遇到的问题。我想引导用户返回“选项卡页面”,在那里没有输入必填字段。例如,如果用户没有选择所选内容的任何财务部分,则财务选项卡页面将显示错误消息 这是查看页面 @using CalFresh.Models @model CalFresh.Models.calfreshByWorkUnitID @using (Html.BeginForm()) { <form id="msform" c

我有一个表格,有几个标签,我需要验证。这就是我遇到的问题。我想引导用户返回“选项卡页面”,在那里没有输入必填字段。例如,如果用户没有选择所选内容的任何财务部分,则财务选项卡页面将显示错误消息

这是查看页面

     @using CalFresh.Models
     @model CalFresh.Models.calfreshByWorkUnitID

     @using (Html.BeginForm())
     {
         <form id="msform" class="form-inline" method="post">
         <div id="TabsSetMain">
             <table>
                 <tr>
                     <td>Some reviewer info</td>
                 </tr>
             </table>
         </div>
         @*--------------------- Sub Tabs (Household/Financial/Medical)-----
         <div id="TabsSet1">
            <ul id="progressbar">
               <li><a href="#tabs-household">Household</a></li>
               <li><a href="#tabs-financial">Financial</a></li>
               <li><a href="#tabs-medical">Medical</a></li>
            </ul>
         </div>
         @*-------------------- Household Tab -----------------
         <div id="tabs-household">
            <table>
               <tr>
                  <td>Was the SSN Verified?</td>
                  @{
                     List<SelectListItem> listItems = new List<SelectListItem>();
                     listItems.Add(new SelectListItem
                       {
                          Text = " -- Select One -- ",
                          Value="",
                          Selected = true
                       });
                     listItems.Add(new SelectListItem
                       {
                          Text = "Yes",
                          Value="Yes"
                       });
                      listItems.Add(new SelectListItem
                       {
                          Text = "No",
                          Value="No"
                       });

                   }
                  <td>
                     @Html.DropDownListFor(model=>model.tempHouseHoldSSNVerification, listItems, new {@class="form-control", value=Model.tempHouseHoldSSNVerification})
                     @Html.ValidationMessageFor(model=>model.tempHouseHoldSSNVerification, null, new {style="color:red"})
                  </td>
               </tr>
            </table>
         </div>
         @*-------------------- Financial Tab -----------------
         <div id=tabs-financial">
             <table>
               <tr>
                   <td>
                       Was an error found for earned income calculation?
                   </td>
                   <td>
                     @Html.DropDownListFor(model=>model.tempFinancialEarnIncome, listItems, new {@class="form-control", value=Model.tempHouseHoldSSNVerification})
                     @Html.ValidationMessageFor(model=>model.tempFinancialEarnIncome, null, new {style="color:red"})
                   </td>
               </tr>

             </table>
         </div>
       </form>
     }

     <script>
        $(function () {
        $("#TabsSetMain").tabs();
        });
     </script>

     <script>
      $(function () {
      $("#TabsSet1").tabs();
      });
     </script>
这是控制器代码

  using System;
  using System.Configuration;
  using System.Linq;
  using System.Web.Mvc;
  using System.Net;
  using System.Data;
  using CalFresh.Models;

  namespace CalFresh.Controllers
  {
      public string pubTempHouseHoldSSNVerification;
      public string pubtempFinancialEarnIncome;

      [HttpPost]
      public ActionResult Add(calfreshByWorkUnitID customerinfo)

      pubTempHouseHoldSSNVerification = customerinfo.tempHouseHoldSSNVerification;

      pubtempFinancialEarnIncome = customerinfo.tempFinancialEarnIncome;

      if (ModelState.IsValid)
      {
               @*  Process my insert script here.
      }
  }

模型状态在视图中通过
ViewData.ModelState
提供。我不知道您使用的是什么选项卡库,但在某些地方您需要检查哪些字段在模型状态下无效,找出它们在哪个选项卡上,并将焦点设置在该选项卡上

您应该能够使用以下方法获取有错误的字段

ViewData.ModelState.Where(fld => fld.Value.Errors.Count > 0)
或者检查各个字段

ViewData.ModelState.IsValidField("FIELD_NAME")
如果无法使用css或某种标记服务器端设置具有焦点的选项卡,则需要将有错误的字段转储到javascript变量中,并从中开始

<script>
    var errors = '@string.Join(",", ViewData.ModelState.Where(x => x.Value.Errors.Count > 0).Select(fld => fld.Key))';
    ....
</script>

var errors='@string.Join(“,”,ViewData.ModelState.Where(x=>x.Value.errors.Count>0)。选择(fld=>fld.Key));
....
<script>
    var errors = '@string.Join(",", ViewData.ModelState.Where(x => x.Value.Errors.Count > 0).Select(fld => fld.Key))';
    ....
</script>