Question

我有一个表单，可以动态添加和删除一组表单字段（使用javascript），因此使用名称的数组值（例如：id =“namesupplier []”）通过ajax传递它们。

我的问题与使用jquery validate（）有关 - 类似于Jquery Validation with Identical Form Names中所述。我还在该页面上使用了JAB（第二个解决方案）建议的解决方案，但它并不完全有效;当在例如第二个（第三个等）集的表单字段中输入错误值时，错误消息总是在第一个集合中的表单字段中弹出（与第二个（第三个）中的表单字段相关的错误框set确实按预期指示错误颜色，但没有消息）

知道如何解决这个问题吗？

代码添加＆amp;删除表单字段（getProductconfigform（）返回一个包含一组所有表单字段的字符串;每个表单字段的名称= anarrayvalue []））

 <script src="js/jquery-1.10.1.min.js"></script>
 <script src="js/productconfigform1.js"></script>
 <script>
        //!max of 5 energy electricity products!
        //values of these variables are posted to server (in $_POST paremters)

        var form = getProductconfigform(); //create a  string with the product forms

        var NUMBER_OF_FORMS = 8;

        //script for adding and removing productss
        $(document).ready (function () {
            $('.btnAdd').click (function () {     
                $('.buttons').append(form); // end append
                $('div .btnRemove').last().click (function () { 
                    $(this).parent().last().remove();    
                }); // end click
            }); // end click                

        }); // end ready
 </script>

使用jquery validate（）函数的代码：

<script>
$(function() {

    $("#myForm").validate({

    rules: {
            // simple rule, converted to {required:true}


            "productname[]": {
                required:true,
                minlength: 2,
                maxlength: 30,
            },


            "energyunitinv[]": {
                required:true,
                number: true,
                maxlength: 8,
            }


            } //rules
    }); //validate()

}); //function

</script>

提到的javascript函数getProductconfigform（）的代码，它返回包含所有表单字段的字符串：

function getProductconfigform()
{
 var form;

 form = '<div>\<p> Product - algemeen </p>\
        <label class="field2" for="productname[]"> Product naam </label> <input     id="productname[]" type="text" name="productname[]"> <br>\
        <label class="field2" for="eproducttype[]"> Product type</label> <select name="eproducttype[]"> \

 <input type="button" class="btnRemove" value="Remove"><br></div>';

 return form;
}

Answer 1

我有一些建议：

您始终在同一表单中添加验证：

$("#myForm").validate(...)

为每个表单添加一个类，以便您可以这样做： $(".myFormClass").validate(...)

您不应该向页面添加具有相同ID（myform）的表单，这将导致HTML无效。例如，您不必在表单中添加ID，或者您可以在ID的末尾添加一个数字，因此myForm1，myForm2，...将是ID。

我不认为这是一个数组"productname[]"，它是一个带方括号的名称，所以它没有任何区别。

具有相同表单名称的jquery验证会创建单个错误消息

1 个答案: