验证没有id的表单

时间:2013-08-27 12:13:39

标签: javascript jquery forms validation

我有一个包含没有ID的元素的表单,因为使用while循环创建了多次相同的表单。我试图验证它,但如果没有ID来获取它们,则无法想到如何获取元素值。我已经搜索了互联网以尝试元素的名称,但因为每次创建的表单都不重复时,名称也会重复。

有没有一种简单的方法来验证这种类型的表单?

5 个答案:

答案 0 :(得分:0)

在循环中创建控件时,您可以为控件创建唯一的nameID值。

txt1
txt2
txt3
txt4
txt5

因此,如果它是PHP,您可能会"txt<?php echo count; ?>"或类似的东西。

答案 1 :(得分:0)

表单字段不应该通过标识(即唯一)真正验证,它们应该按类型验证(使用类或名称属性实现)。

例如,电子邮件字段可能包含班级.validate-email。在jQuery中,您使用.each()

遍历所有电子邮件字段
$('.validate-email').each(function() {
    $field = $(this);
    // do your validation here...
});

或者您可以使用.keyup()

等操作功能
$('.validate-email').keyup(function() {
    $field = $(this);
    // do your validation here...
});

编辑以发表评论:

说你有:

<form id="student_form">
  <!-- some fields... -->
  <div>
    <select class="grade"><!-- markup... --></select>
    <select class="reason_select"><!-- markup... --></select>
    <!-- as many as you want -->
    <select class="reason_select"><!-- markup... --></select>
  </div>
  <-- more fields... -->
</form>

在表单提交上,也许您可​​以尝试:

$("form#student_form").submit(function(form_event) {
    var $grade = $(this).find(".grade");     
    var valid = true;
    if ($grade.val() != "1") {
       $grade.siblings(".reason_select").each(function() {
           if ($(this).val() == "") // or whatever is appropriate
               valid = false;
       })
    }
    valid || form_event.preventDefault();
});

答案 2 :(得分:0)

我同意上述答案。 您无法验证此表单的原因是您的表单具有相同/相似的选择器。

为表单提供相同的ID(可以像<form id="form1">或类似的那样。 如果表单与其他表单不匹配,则应对其中的输入字段执行相同操作。但是,在这里您可以使用类,因为您可以使用表单ID通过jQuery validate选择输入字段(例如:$('#form1 .txtUserName').validate(/* Your functions and other specifications goes here */);)。

希望这会有所帮助。 :)

/ J。

答案 3 :(得分:0)

如果您需要处理类似元素的数组,可以使用ul > li方法(当然ul需要ID)。

<ul id="elementList">
    <li><!-- element1 --></li>
    <li><!-- element2 --></li>
    <li><!-- element3 --></li>
</ul>

然后,使用jQuery,您可以使用类似的东西访问它:

$('#elementList').each(function(index){
    validateElement(index);
});

希望这会有所帮助:)

答案 4 :(得分:0)

  

“我有一个名为成绩的选择,还有4个名为reason_select的选项。如果成绩不是1,那么reason_selects中至少有一个应该有一个值。”< / em>的

假设您的所有表单都有这五个选择元素,并且您只想验证那些提交的单个表单的那些,您可以执行以下操作:

$("form").submit(function(e) {
    var $form = $(this),
        reasonHasVal = false;
    if ($form.find('select[name="grade"]').val() != "1") {
       $form.find("select.reason_select").each(function() {
           if ($(this).val() != "") {
               reasonHasVal = true;
               return false;
           }
       });
       if (!reasonHasVal) {
           e.preventDefault();
           alert("Please select a reason.");
       }
    }
});

关键是使用.find() method来处理相关表单中的元素。