0

こんにちは、jquery 検証プラグインと追加のメソッド プラグインを使用して、複製されたテキスト フィールドを検証する方法について説明してください。私の HTML コードは次のようなものです。ベロー。

JSP

 <input type="hidden" id="experiencelength" name="experiencelength" value=""/>
                                    <tr>
                                    <td> <input type="text" id="previouscompanyname" name="previouscompanyname" maxlength="200" class="input-large" style="height:27px; " value="${param.previouscompanyname}"/>          
                                        <p id="previouscompanyname" style="color: red"/>
                                        <html:errors property="previouscompanyname"/></td>
                                    <td> <input type="text" id="jobtitle" name="jobtitle" maxlength="200" class="input-large" style="height:27px; " value="${param.jobtitle}"/>          
                                        <p id="jobtitle" style="color: red"/>
                                        <html:errors property="jobtitle"/></td>
                                    <td> <input type="text"  class="input-large datepicker" style="height:27px;" readonly="true" id="jobfromdate" name="jobfromdate"  value="${param.dateofjoining}"/>
                                        <html:errors property="jobfromdate"/></td>
                                    <td>  <input type="text"  class="input-large datepicker" style="height:27px;" readonly="true" id="jobtodate" name="jobtodate"  value="${param.dateofjoining}"/>
                                        <html:errors property="jobtodate"/></td><td></td>
                                    </tr>
                                    <tr>
                                    <td>
                                    <button type="button" class="btn btn-info" id="workexperience">Add New</button>

複製スクリプト

 $("#workexperience").click(function() {
//        var jobfromdate = 0;
        var date = '<td><input type="text" class="input-large datepicker" style="height:27px;" readonly="true" id="jobtodate1' + j + '" name="jobtodate1"/></td>';
        var date1 = '<td><input type="text" class="input-large datepicker" style="height:27px;" readonly="true" id="jobfromdate' + k + '" name="jobfromdate"/></td>';
        var remve = '<td><button type="button"  class="removeworkexperience" class="btn btn-info" >x</button></td>';
        $(this).closest('tr').prev('tr').clone(true).insertAfter($(this).closest('tr').prev('tr')).find('td:last-child').remove().find('td:last-child').remove();
        $(this).closest('tr').prev('tr').find('td:last-child').remove();
        $(this).closest('tr').prev('tr').find('td:last-child').remove();
        $(this).closest('tr').prev('tr').append(date).append(date1).append(remve);
        $('#jobtodate1' + j).datepicker();
        $('#jobfromdate' + k).datepicker();
        ++k;
        ++j;
        document.getElementById("experiencelength").value = j;
    });

確認

 $('#employee_table').validate({
        rules: {
            firstname: {
                required: true,
                letterswithbasicpunc: true
            },
            lastname: {
                minlength: 1,
                required: true,
                letterswithbasicpunc: true
            },
            generateemployeeID: {
                required: true,
                minlength: 3
            },
            email: {
                required: true,
                email: true
            },
            sourceofhire: {
                required: true
            },
            designation: {
                letterswithbasicpunc: true
            },
            otheremail: {
                email: true,
                minlength: 10

            },
            previouscompanyname:{
                 required: true
            },
            agree: "required"

        },
        highlight: function(element) {
            $(element).closest('.control-group').removeClass('success').addClass('error');
        },
        success: function(element) {
            element
                    .text('OK!').addClass('valid')
                    .closest('.control-group').removeClass('error').addClass('success');
        }
    });
4

1 に答える 1

1

重複する が含まれるため、「複製された」フィールドを検証することはできませんname。このプラグインが検証を追跡する方法であるため、検証の対象となるすべてのフィールドには一意の属性が含まれている必要があります。 name

nameそのため、unique を作成する方法と同様に、コードを修正して unique を作成する必要がありますid。.datepicker()また、プラグインを初期化する方法と同様のルールを宣言する必要があります。

プラグインの.rules()メソッドを使用します....

$('input[name="myNewUniqueName"]').rules('add', {
    required: true,
    minlength: 1
});
于 2014-03-24T04:48:51.277 に答える