0

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

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

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

添加和删​​除表单字段的代码（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;
}
4

1 回答 1

0

我有几个建议：

您一直在向同一个表单添加验证：

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

为每个表单添加一个类，以便您可以执行以下操作： $(".myFormClass").validate(...)

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

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

于 2013-07-17T21:21:00.970 回答