驗證具有多個選項卡的MVC表格

我有我需要驗證的幾個選項卡的這種形式。這是我遇到的問題。我想讓用戶回到沒有輸入必填字段的「標籤頁」。例如，如果用戶沒有選擇任何財務部門的選擇，那麼財務標籤頁將顯示錯誤消息。驗證具有多個選項卡的MVC表格

這裏是查看網頁

 @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.ComponentModel.DataAnnotations; 

    namespace CalFresh.Models 
    { 
     public class calfreshByWorkUnitID 
     { 
     [Required(ErrorMessage = "Please select Household SSN verification.")] 
     public string tempHouseHoldSSNVerification { get; set; } 

     [Required(ErrorMessage = "Please select Financial Income Calculations.")] 
     public string tempFinancialEarnIncome { get; set; } 
     } 
    }

這裏是通過ViewData.ModelState視圖控制器代碼

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. 
     } 
    }

來源

2017-05-03 user6815384

模式處於可用狀態。我不知道你使用的是哪個標籤庫，但是你需要檢查哪些字段在模型狀態下無效，找出它們在哪個標籤上，並將焦點設置在該標籤上。

你應該能夠得到使用一些錯誤的領域，如

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>

來源

2017-05-03 22:04:00

驗證具有多個選項卡的MVC表格

回答

相關問題