验证动态创建的输入元件

我有动态创建的输入元件验证动态创建的输入元件

<input type='button' value='Add Another Product' id='aprod'> 
<table id='page3_inside'> 
    <tr id='ln1'> 
     <td> 
      <label for="product_cat">Product Category</label><br> 
      <input type='text' class="input product_category" name="product_category[]" style="font-family:verdana; width:150px; border: 1px solid #000000;"> 
     </td> 

     <td> 
      <label for="qty">Qty</label><br> 
      <input type="text" value="" class="input qty" style="width:100px;" name="qty[]" placeholder="Qty" onkeypress="return isNumberKey(event)"/> 
     </td> 

     <td> 
      <label for="unit">Unit</label><br> 
      <input type='text' class="input unit" style="width:100px;" name="unit[]"> 
     </td> 
     <td> 
      <label for="brand">PO Number</label><br> 
      <input type="text" value="" class="input po" name="po[]" placeholder="PO Number" style='width:150px; height:28px;'/> 
     </td> 

    </tr>    
    </table>

jQuery的用于附加元件的一种形式：

<script> 
$('#aprod').on('click', function() { 
    $('#ln1').clone().appendTo('#page3_inside'); 
    prodnum = prodnum + 1; 
    $('#conf_prodnum').val(prodnum); 
}); 
</script>

如何验证每个输入，因为所有字段属于类。在这个例子中，我将ID用作选择器，但是如何用class来完成它呢？

谢谢。

来源

2015-05-25 Kim Carlo

使用每个循环 – madalinivascu

你的意思是所需？ – MissesSalima

是@MissesSalima –

尝试这样一个循环：

$('form').submit(function() { 

    $('form input.input').each(function() { 

     var valid = 1; 

     if ($(this).val() == '') { 
      $(this).addClass('error'); 
      valid = 0; 
     } else { 
      $(this).removeClass('error'); 
     } 

    }); 

    if (valid === 1) { 
     // submit form 
    } else { 
     console.log('error'); 
     return false; 
    } 

});

您可能需要更改的选择和条件检查的东西不仅仅是空洞的投入更多，但这些都是很容易做到。

我不太清楚他们应该是什么，因为你的输入是在问题的表格中，可能有一个包含form的标签，我知道。

您还可以添加一些样式有错误，突出他们的投入时，表单提交失败：

input.input.error { 
    border: 1px solid red; 
}

来源

2015-05-25 08:50:50 martincarlin87

我这样做是使用id作为选择，但如何使用类做的选择？

$('.conf_prodnum')一个点而不是一个散列将在类而不是IDS上工作。

来源

2015-05-25 08:51:03

使用循环访问包含类输入的每一个元素，并检查您输入像这样：

var inputs= $('.input ') 
for(x in inputs){ 
    x = inputs[x]; 
    //do whatever you want 
}

来源

2015-05-25 08:51:41

为什么不是[.each（）]（https://api.jquery.com/each/）？ – andale

.each（）是另一种选择，我做了更多的Javascript，因此这个解决方案。 –

验证动态创建的输入元件

回答

相关问题