通过JavaScript禁用转发器内的特定验证器

Question

I have some fields in a repeater and I need to validate them.

Here is the scenario: When the page loads I get a set of fields just once(first name, last name etc.) and I get a link "Add another user", if you click the link it adds the same fields again on the bottom.

Now for the code part: In my case I needed to run the repeater 4 times (so the fields are on the page 4 times from the begining). Then I hide them as I hide the <div> that contains them. When the button is clicked I show the first hidden div and so on.

Some code(not all):

 <asp:Repeater ID="rptOtherPeople" runat="server">
 <HeaderTemplate>
      <table>
           <thead>
                <tr>
                     <td>
                          <h3>Други лица</h3>
                     </td>
                </tr>
           </thead>
           <tbody class="GridBody"> 
 </HeaderTemplate>
 <ItemTemplate>
      <tr class="GridRow" id="personRow" style="display: none">
           <td>
                <asp:TextBox ID="txtFirstName" CssClass="mid-inp" Text="" runat="server"></asp:TextBox>
           </td>
      </tr>
 </ItemTemplate>
 <FooterTemplate>
    </tbody>
    </table>
 </FooterTemplate>
 </asp:Repeater>

And here is that javascript that shows the next row:

$(document).ready(function () {
        var peopleNum = 1;

        if ($(".GridBody tr").length > 0) {
            var tr = $(".GridBody tr")[0];
            tr.style.display = 'table-row';
            tr.setAttribute('hidden', 'false');
            var anc = tr.getElementsByTagName('a');
        }

        if ($(".GridBody tr").length > 0 && peopleNum > 0) {
            for (i = 0; i < peopleNum; i++) {
                var tr = $(".GridBody tr")[i];
                tr.style.display = 'table-row';
                tr.setAttribute('hidden', 'false');
                if (i > 0) {
                    var anc = tr.getElementsByTagName('a');
                    if (anc[i] != undefined)
                        anc[i].style.display = 'none';
                }
            }
        }
    })

    function addPerson() {
        var body = $(".GridBody");
        var indexOfNextRow = $('tr[class="GridRow"][hidden="false"]').length;
        var tr = $(".GridBody tr")[indexOfNextRow];
        tr.style.display = 'table-row';
        tr.setAttribute('hidden', 'false');
    }

The Problem: For example I want the field to be required. I put a RequiredFieldValidator and I disable it in some cases and enable it in others. The thing is that I get 4 RequiredFieldValidators on the page and I can only turn ALL of them on or off at once. I want to activate just one of them. I couldn't find a way to do that because they are pretty much identical. Any ideas?

I assume that I can not sort this out in the code behind. Can I work with just one RequiredFieldValidator via javascript(how do I identify the one I want). Some people prefer jquery validation. Is it applicable in this case and how(I have never used jquery validation before)?

EDIT 1

Ok the controls are not identical. In the browser the generated ID is: ctl00_SPWebPartManager1_g_f6926ea5_98ba_46c1_b157_4f1ddc46885d_ctl00_Step21_otherPeople_rptOtherPeople_ctl01_rv1 , but I can not access the validator from here in my Javascript

Answer 1

You can disable the validators either server side or client side.If i understood your question , the thing you looking for is disabling a specific vaidator say required field validator.For that here is a simple javascript code to disable the validators.

    function DisableRFValidators() {
        var ValidatorToDisable = document.getElementById("RequiredFieldValidator2");
        ValidatorEnable(ValidatorToDisable, false);
    }

Answer 2

Fixed it! Here is the code:

    $("#aspnetForm").validate();

    $(".required").each(function (index) {
        if ($(this).attr("id").indexOf("txtFirstName") >= 0) {
            $(this).rules("add", {
                required: true,
                minlength: 3,
                messages: {
                    required: "<div class='val' style='color:red'>Name is Required!</div>",
                    minlength: "<div class='val' style='color:red'>Minimum number of symbols = 3!</div>"
                }
            });
        }
        else if ($(this).attr("id").indexOf("txtFirstName") >= 0){
            $(this).rules("add", {
                required: false
            });
        }
    });

function validateData() {
    var result = $("#aspnetForm").valid();
    return result;
}

function btnNextClick(btn_this) {
    var btnNext = document.getElementById("<%=btnMoveNextHidden.ClientID%>");
    if (btnNext != null && validateData() == true) {
        btnNext.click();
    }
}