Question

我在验证动态生成的表单时遇到了一些困难。一般的想法是我必须一次提交多个表格并事先验证它们。但是，我不能提前知道表单ID。

以下是表格：

/* Begin Edit Row Fields */
        echo "<tr id=\"$I_ID\" class=\"toggleEdit\">";
            echo "<td>";
                echo $row[1];
            echo "</td>";
        /* Begin submit edits form(s) */
        /* Loop for generation of form values and text fields */
        for ($pointer = 2 ; $pointer < $countRows ; ++$pointer) {
            echo "<td>";
                echo "<form class=\"validateForms\" id=\"validateForms" . $I_ID . "\" name=\"editRow[]\" action=\"\" method=\"POST\">";
                echo "<input type=\"text\" value=\"$row[$pointer]\" name=\"$columns[$pointer]\">";
                echo "</form>";
            echo "</td>";
        } //End loop
            echo "<td>";
                /* Static form values */
                echo "<form id=\"" . $I_ID . "editRow\" name=\"" . $I_ID . "editRow\" action=\"\" method=\"POST\">";
                    echo "<input type=\"hidden\" name=\"I_ID\" value=\"$I_ID\">";
                    echo "<input type=\"hidden\" name=\"editRow\" value=\"$thatTable\">";
                echo "</form>";
                echo "<input type=\"button\" id=\"" . $I_ID . "editRow\" class=\"submitEdit\" value=\"Submit Edit\">";
        /* End submit edits form(s) */
            echo "</td>";
        echo "</tr>";
        /* End edit row fields */

以下代码不起作用，但捕获了我想要完成的内容。我需要.on＆＃39;点击＆＃39;功能，因为我同时提交了几个表格。我还需要一种方法来对多个表单应用验证，但也需要区分表单的分组。我不知道如何完成我想从这里做的事情。

$('.validateForms').validate({

        //However many rules I need

        $('.submitEdit').on('click', function() {
            var i_id = $(this).attr('id');  
            var formSubmit = [
                         document.forms[i_id],
                         document.forms[i_id + "2"],
                         document.forms[i_id + "3"],
                         document.forms[i_id + "4"],
                         document.forms[i_id + "5"],
                         document.forms[i_id + "6"],
                         document.forms[i_id + "7"],
                         document.forms[i_id + "8"],
                         document.forms[i_id + "9"]
                         ]     

        //It seems like I actually need to apply the rules here to cover the specific forms

            submitHandler: function(form) {
                $.ajax({
                    type: 'POST', 
                    url: "IRCprocessDrawTables.php",
                    data: $(formSubmit).serializeArray(),
                    cache: false,
                    success: function(result){
                        $('body').html(result);
                    } //end result
                }); //end .ajax
            } //end submitHandler
        }); //end click
    }); //end validate

Answer 1

您不需要知道用于验证表单的ID只需在类上调用jQuery的每个函数，如下所示：

    $('.submitEdit').on('click', function() {
       $('.validateForms').each(function(){
          var err = 0;
          var form = $(this).attr('id');
          $(form + ' :input').each(function(){
             if ($(this).val() === null || $(this).val().length === 0){
                err++;
             }
          }
          if (err > 0){
             //Err Code Here
          } else {
             //Success Code Here
          }
       }
    }

我没有针对您的代码对此进行测试，但我之前使用过类似的解决方案，稍微调整一下，我认为这应该适合您。

使用Javascript验证动态生成的表单

1 个答案: