Validieren Sie alle Eingabefelder in einem div mit jQuery

Question

Ich benutze unten jQuery-Funktion, um alle Felder innerhalb eines div zu validieren. Mein Problem ist, dass es immer falsch zurückkehrt, auch wenn ich alle Felder ausfülle.

function validate(id) { 
      //:text, :checkbox, select, textarea 
      var isFormValid = true; 
      var div = $(id); 
      $(div).find(":text, select").each(function() { 
       if (this.value == "" && !$(this).hasClass("no-req")) { 
        $(this).addClass("required"); 
        isFormValid = false; 
        $(this).focus(); 
       } 
       else { 
        $(this).removeClass("required"); 
       } 
      }); 
      if (!isFormValid) { 
       alert("Please fill all the higlighted fields!"); 
      } 
      return isFormValid; 

     } 

auf Asp.net Schaltfläche Client Klicke ich diesen Code verwenden

<asp:Button ID="btnSave" runat="server" Text="Save" class="btn btn-success" OnClientClick="javascript: return validate('#tdAdd');" OnClick="btnSave_Click" /> 

Answer 1

ändert diese:

$(div).find(":text, select").each(function() { 
    if (this.val() == "" && !$(this).hasClass("no-req")) { 

An:

div.find(":text, select").each(function() { 
    if ($(this).val() == "" && !$(this).hasClass("no-req")) { 

Answer 2

Warum ein Build nicht verwenden -in aspnet Benutzerdefinierter Validator? Sie können dann alle TextBoxen in einem bestimmten div durchsuchen und den Validator-Wert zurückgeben.

<div id="validateTheseControls"> 
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
    <br /> 
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 
    <br /> 
    <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /> 

    <asp:CustomValidator ID="CustomValidator1" runat="server" 
    ClientValidationFunction="validateControlsInDiv" ErrorMessage="Not all fields are filled"></asp:CustomValidator> 
</div> 

<script type="text/javascript"> 
    function validateControlsInDiv(sender, element) { 
     var isValid = true; 

     $('#validateTheseControls input[type="text"]').each(function() { 
      if ($(this).val() == "") { 
       isValid = false; 
      } 
     }); 

     element.IsValid = isValid; 
    } 
</script>