條件驗證的單個文本框

Question

我有一個下拉式和單個文本框MVC3 /剃刀形式。下拉菜單有兩個選項可以選擇OrderID或ClerkName。

如果用戶選擇OrderID，那麼我只想接受數字[0-9]進入文本框，如果用戶選擇ClerkName，那麼我只想接受文本框中的字符[a-z，A-Z]。

我想在這裏jQuery驗證..請幫助我在這個方向。

在這裏，我們需要檢查兩種情況下的驗證，1.在表單加載和2.在DDL選擇變化.....請幫助。

@{ 
    ViewBag.Title = "Index"; 
} 
@using (Html.BeginForm()) 
{ 
    <div id="mainP"> 
     <div> 
      @Html.DropDownList("SearchBy", new[] { new SelectListItem { Text = "Order ID", Value = "OrdId" }, 
                new SelectListItem { Text = "Clerk Name", Value = "ClerkName" } }) 
      <br /> 
      @Html.TextBox("SearchedText", ViewData["SEARCHED_TEXT"] == null ? "" : ViewData["SEARCHED_TEXT"], new { @class = "search_text_area" }) 
      <br /> 
     </div> 
     <input type="button" id="btnSubmit" value="Submit" /> 
    </div> 

} 
<script type="text/javascript"> 

    $(function() { 



    }); 

</script> 

Answer 1

我假設你真的想：清除選擇更改輸入（通過您的驗證規則，因爲它不再有效）和驗證上提交，不會形成負擔。

$(function(){ 
    // Get a reference to the controls we'll re-use throughout the program 
    var searchedText = $("#SearchedText"); 
    var searchBy = $("#SearchBy"); 

    // Determine the validation regular expression 
    function GetValidationRegex(){ 
    if (searchBy.val() == "OrdId") 
     return /^[0-9]+$/; 
    else 
     return /^[a-zA-Z ]+$/; 
    } 

    // Define our on change handler 
    function SearchByChangeHandler(){ 
    // Clear the input 
    searchedText.val(""); 
    } 

    // Bind the handler 
    $("#SearchBy").change(SearchByChangeHandler); 

    // Bind to the form submit to validate 
    $("form").submit(function(){ 
    // Get the text 
    var value = searchedText.val() 
    // If no text, error case 1 
    if (!value){ 
     alert("A value is required..."); 
     return false; 
    } 
    // If doesn't match the validation expression for the current selection 
    // this is your error case 
    else if (value.match(GetValidationRegex()) == null){ 
     alert("Regex doesn't match..."); 
     return false; 
    } 

    }); 

}); 

Answer 2

你必須創建一個自定義的驗證規則：

​​3210

然後將這種像這樣：

$("#SearchBy").rules("add", { 
    numbersXorLetters: true 
}); 

希望這有助於。乾杯