使用数组变量动态创建的多个输入的表单验证

时间:2017-08-21 09:36:03

标签: javascript php jquery html validation

这是我的javascript代码

<script type="text/javascript">
//function to add new row
jQuery(function() {
  var counter = 1;
  var nextRowId=($('#tb tr').length)-1;
 //number of rows fetched from database
  jQuery('a.addrow').click(function(event) {
    event.preventDefault();

    var newRow = jQuery('<tr><td colspan="3" class="table-active">'+nextRowId+'</td><td colspan="3" class="table-active"><input type="number" name="emp_code[' + nextRowId + ']" id="emp_code[' + nextRowId + ']"  class="form-control"/><div class="error"><?php echo $genderError;?></div></td><td colspan="3" class="table-success"><input type="text" name="emp_name[' + nextRowId + ']" id="emp_name[' + nextRowId + ']" class="form-control" required/></td><td colspan="3" class="table-info"><input type="text" name="emp_mailid[' + nextRowId + ']" id="emp_mailid[' + nextRowId + ']" class="form-control" required/></td><td colspan="3" class="table-info"><select required class="form-control" id="nomination[' + nextRowId + ']" name="nomination[' + nextRowId + ']"> <option value="">Select</option><option value="Nominated">Nominated</option><option value="Invited">Invited</option><option value="Both">Both</option><option value="None">Neither nominated nor invited</option></select></td><td colspan="3"><label><input type="radio" name="attendance[' + nextRowId + ']" id="attendance[' + nextRowId + ']" value="1" required>Yes</label><label><input type="radio" name="attendance[' + nextRowId + ']" id="attendance[' + nextRowId + ']" value="0">No</label></td><td><a href="javascript:void(0);" class="remove" onclick=><span class="glyphicon glyphicon-remove"></span></a></td></tr>');
    counter++;
     nextRowId++;
    jQuery('table.table').append(newRow);
     $('#emp_code['+ nextRowId + ']').rules('add',{
       required:true,
     });
  //Init bootstrapToggle
  $('.toggleone').bootstrapToggle({
    on: 'Yes',
    off: 'No'
  });
  });
}); 

</script>

我想验证使用各种约束点击提交按钮的所有值 `

  • emp_code []`:required和number emp_name []:仅限必需 字母表emp_mailid []:必填和电子邮件验证 提名[]:要求出席[]:必要

我尝试了所有解决方案来自 SO 没有成功。我错了。我希望这与jquery有关。有人帮我这么做

2 个答案:

答案 0 :(得分:0)

也许这可能有所帮助。

HTML模式属性

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_pattern

答案 1 :(得分:0)

如果你想在jquery上,也许你应该试试这个。

$('.txtOnly').bind('keyup blur',function(){ 
    var node = $(this);
    node.val(node.val().replace(/[^a-z]/g,'') ); }
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="lorem" class="txtOnly">