JQuery code to find all the validators within a div

I've got a section of a page I'm hiding and showing, and the validators within the section need to be enabled and disabled, depending on whether it is shown or hidden.

I'm currently accessing the validators by passing the IDs through in a hidden field, but I think I should be able to do it with JQuery - can anyone give me the code to get all the validators within a div?

Note I don't want all the validators on the page, just those that fall within the div.

Thanks
purplesoupProgrammerAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

StingRaYCommented:
You can access all validators within the div by this code.

$('#'+ divId + ' ' + validatorSelector)
0
Kiran SonawaneProject LeadCommented:
Look at view source generated for validation control (whether span or div) then change it accordingly

$("#div1 div[id^=your_selector]").each(function(){
   // Your code goes here
});
0
purplesoupProgrammerAuthor Commented:
StingRaY - what do you mean by validatorSelector ?

sonawanekiran - sorry I'm not following - what am I looking for when I look at the source generated for the validation control - and how do I reference each control in your code - can you show how I would enable or disable the validation?
0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

StingRaYCommented:
$('#'+ divId + ' ' + validatorSelector)

Open in new window


the validatorSelector is used to select or not select any control in your form.

For example, if you want to select ALL input under displayed section, you can use this code.

$('#'+ divId + ' div:visible input').each(function(){
// validation ...
});

Open in new window


divId is container of all sections. The code above is selecting ALL input under a visible section under the given container.
0
purplesoupProgrammerAuthor Commented:
Hi StingRaY - thanks for explaining, but I'm still not with you. I need to select all validators within my Div - is it possible? Is there a way to identify all validators?
0
StingRaYCommented:
Can you show me the sample of your validators? I will show you how to select them.
0
purplesoupProgrammerAuthor Commented:
Sorry, I had missed this reply.

The code is too big to copy the whole thing in, I can given you an example I guess, it is just a mixture of required field validators, regular expression and checking two controls are equal. Why do you need a sample?

For the sake of argument, show me how you would do it for the validators within the div in this code:

 
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="FindValidators._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>.
    </p>
    <p>
        You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&amp;clcid=0x409"
            title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
    </p>
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
        ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
    <br />
        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"  ControlToValidate="TextBox2"
        ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
    <br />
    <asp:CheckBox ID="ControlValidators" runat="server" />
    <div id="ValidateContainer" runat="server" >
        <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="TextBox3"
        ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
    <br />
        <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="TextBox4"
        ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
    <br />
    </div>
    <asp:Button ID="ValidateButton1" runat="server" Text="Button" />
</asp:Content>

Open in new window

0
StingRaYCommented:
Oh! I mean the html code when you view at the page source on your web browser.
0
purplesoupProgrammerAuthor Commented:
ok - here you are:

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head><title>
	Home Page
</title><link href="Styles/Site.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form method="post" action="Default.aspx" onsubmit="javascript:return WebForm_OnSubmit();" id="ctl01">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE3NDg2Nzk1NzhkGAEFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYBBSNjdGwwMCRNYWluQ29udGVudCRDb250cm9sVmFsaWRhdG9yc3OxhqYOTmyHN1vgpeO2EYljBWrePCV+s5XKWXW/xXIf" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['ctl01'];
if (!theForm) {
    theForm = document.ctl01;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>

</script>


<script src="/WebResource.axd?d=STMktD0M7fEsjZjoHQ_6uQmaKgxyVgpIMblWxAE8ispHvCkvy2etdXdJEgqiXHZcKpq2FxHF8w61nbpcJ-Wq8s3CrQkyl5nDioAAsP6s-VI1&amp;t=634568724389128140" type="text/javascript"></script>


<script src="/WebResource.axd?d=X11lrgI2uLmofHSEogMhHgfKxbULR0fGi8XtysZ6Kov5Cwk5oqkp_GRA2re1wE9_H-vrYHJNerfS2UBYsok7GPO5RbW78YqmJnN_Qo6Eu4s1&amp;t=634568724389128140" type="text/javascript"></script>
<script src="/WebResource.axd?d=PxiSdumC3fO3SbP6eq03AEtlJN6L_9oRn_pzftmWTNw6H3N0vmGxkYUKbHG-jR9lul6eZIUvt-WDpl9VxlLSfJtY_YS4xe8K3Ittom0DdM01&amp;t=634568724389128140" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
if (typeof(ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
//]]>
</script>

<div class="aspNetHidden">

	<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBwK4/ruQCwLR49OXDQLR48eXDQLKlaDDAwLR48uXDQLR47+XDQLwpqjyBoQceovi4qSAlw2rVymXeitNv5dTSRxp+aqlCN8vAUzV" />

</div>
    <div class="page">
        <div class="header">
            <div class="title">
                <h1>
                    My ASP.NET Application
                </h1>
            </div>
            <div class="loginDisplay">
                
                        [ <a href="Account/Login.aspx" id="HeadLoginView_HeadLoginStatus">Log In</a> ]
                    
            </div>

            <div class="clear hideSkiplink">
                <a href="#NavigationMenu_SkipLink"><img alt="Skip Navigation Links" src="/WebResource.axd?d=hpNQPuFcU3gxtyzz9kPxscxOz3VadQB_812sVxK0ngJavQi9s8rB-C9ONaEdo-Wa0yjAfGH8-vNZApeQjk6QLa8mcBNxYg5OrS22Zsux0to1&amp;t=634568724389128140" width="0" height="0" style="border-width:0px;" /></a><div class="menu" id="NavigationMenu">
	<ul class="level1">
		<li><a class="level1" href="Default.aspx">Home</a></li><li><a class="level1" href="About.aspx">About</a></li>
	</ul>
</div><a id="NavigationMenu_SkipLink"></a>
            </div>
        </div>

        <div class="main">
            
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>.
    </p>
    <p>
        You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&amp;clcid=0x409"
            title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
    </p>

    <input name="ctl00$MainContent$TextBox1" type="text" id="MainContent_TextBox1" />
    <span id="MainContent_RequiredFieldValidator1" style="visibility:hidden;">RequiredFieldValidator</span>
    <br />
        <input name="ctl00$MainContent$TextBox2" type="text" id="MainContent_TextBox2" />
    <span id="MainContent_RequiredFieldValidator2" style="visibility:hidden;">RequiredFieldValidator</span>
    <br />
    <input id="MainContent_ControlValidators" type="checkbox" name="ctl00$MainContent$ControlValidators" />
    <div id="MainContent_ValidateContainer">

        <input name="ctl00$MainContent$TextBox3" type="text" id="MainContent_TextBox3" />
    <span id="MainContent_RequiredFieldValidator3" style="visibility:hidden;">RequiredFieldValidator</span>
    <br />
        <input name="ctl00$MainContent$TextBox4" type="text" id="MainContent_TextBox4" />
    <span id="MainContent_RequiredFieldValidator4" style="visibility:hidden;">RequiredFieldValidator</span>
    <br />
    </div>
    <input type="submit" name="ctl00$MainContent$ValidateButton1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$ValidateButton1&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="MainContent_ValidateButton1" />

        </div>
        <div class="clear">
        </div>
    </div>
    <div class="footer">
        
    </div>
    
<script type="text/javascript">
//<![CDATA[
var Page_Validators =  new Array(document.getElementById("MainContent_RequiredFieldValidator1"), document.getElementById("MainContent_RequiredFieldValidator2"), document.getElementById("MainContent_RequiredFieldValidator3"), document.getElementById("MainContent_RequiredFieldValidator4"));
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var MainContent_RequiredFieldValidator1 = document.all ? document.all["MainContent_RequiredFieldValidator1"] : document.getElementById("MainContent_RequiredFieldValidator1");
MainContent_RequiredFieldValidator1.controltovalidate = "MainContent_TextBox1";
MainContent_RequiredFieldValidator1.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator1.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator1.initialvalue = "";
var MainContent_RequiredFieldValidator2 = document.all ? document.all["MainContent_RequiredFieldValidator2"] : document.getElementById("MainContent_RequiredFieldValidator2");
MainContent_RequiredFieldValidator2.controltovalidate = "MainContent_TextBox2";
MainContent_RequiredFieldValidator2.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator2.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator2.initialvalue = "";
var MainContent_RequiredFieldValidator3 = document.all ? document.all["MainContent_RequiredFieldValidator3"] : document.getElementById("MainContent_RequiredFieldValidator3");
MainContent_RequiredFieldValidator3.controltovalidate = "MainContent_TextBox3";
MainContent_RequiredFieldValidator3.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator3.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator3.initialvalue = "";
var MainContent_RequiredFieldValidator4 = document.all ? document.all["MainContent_RequiredFieldValidator4"] : document.getElementById("MainContent_RequiredFieldValidator4");
MainContent_RequiredFieldValidator4.controltovalidate = "MainContent_TextBox4";
MainContent_RequiredFieldValidator4.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator4.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator4.initialvalue = "";
//]]>
</script>

<script type='text/javascript'>new Sys.WebForms.Menu({ element: 'NavigationMenu', disappearAfter: 500, orientation: 'horizontal', tabIndex: 0, disabled: false });</script>
<script type="text/javascript">
//<![CDATA[

var Page_ValidationActive = false;
if (typeof(ValidatorOnLoad) == "function") {
    ValidatorOnLoad();
}

function ValidatorOnSubmit() {
    if (Page_ValidationActive) {
        return ValidatorCommonOnSubmit();
    }
    else {
        return true;
    }
}
        //]]>
</script>
</form>
</body>
</html>

Open in new window

0
StingRaYCommented:
Ok, thank you.

Now, by your code, you have 4 validators residing in 4 spans. They are all hidden.
The names of validators are MainContent_RequiredFieldValidator1, 2, 3 and 4.

To access ALL validators falling IN the div id="MainContent_ValidateContainer" using jQuery, you can use:

// to select all validators within div
$('div#MainContent_ValidateContainer span[id^="MainContent_RequireFieldValidator"]')

// Loop through them
$('div#MainContent_ValidateContainer span[id^="MainContent_RequireFieldValidator"]').each(function(){
    // .... YOUR CODE
});

// to select all shown validators within div
$('div#MainContent_ValidateContainer span[id^="MainContent_RequireFieldValidator"]:visible')

Open in new window

0
purplesoupProgrammerAuthor Commented:
Well I've tried getting your code working. I've added a div called MainContent_ValidateContainer and placed some validators within it. I've then tried disabling all the required field validators, or iterating through the validators to get their values. Neither appears to return/do anything.

Note your code refers to "RequireFieldValidator" - I believe it should be "RequiredFieldValidator".

Here is my code, including the full page source.


 
<!DOCTYPE html>
<html>
<head><title>
	Home Page
</title><link href="Styles/Site.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form method="post" action="default.aspx" onsubmit="javascript:return WebForm_OnSubmit();" id="ctl01">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJMjQ3MDk1NzMwZGRfNih+WyxnAvwnNWjpmhYBo2CHLV2vePMV6Xaml2H2Ew==" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['ctl01'];
if (!theForm) {
    theForm = document.ctl01;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>

</script>


<script src="/WebResource.axd?d=STMktD0M7fEsjZjoHQ_6uQmaKgxyVgpIMblWxAE8ispHvCkvy2etdXdJEgqiXHZcKpq2FxHF8w61nbpcJ-Wq8s3CrQkyl5nDioAAsP6s-VI1&amp;t=634568724389128140" type="text/javascript"></script>


<script src="/WebResource.axd?d=X11lrgI2uLmofHSEogMhHgfKxbULR0fGi8XtysZ6Kov5Cwk5oqkp_GRA2re1wE9_H-vrYHJNerfS2UBYsok7GPO5RbW78YqmJnN_Qo6Eu4s1&amp;t=634568724389128140" type="text/javascript"></script>
<script src="/WebResource.axd?d=PxiSdumC3fO3SbP6eq03AEtlJN6L_9oRn_pzftmWTNw6H3N0vmGxkYUKbHG-jR9lul6eZIUvt-WDpl9VxlLSfJtY_YS4xe8K3Ittom0DdM01&amp;t=634568724389128140" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
if (typeof(ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
//]]>
</script>

<div class="aspNetHidden">

	<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBQKPscapCwLR49OXDQLR48eXDQLR48uXDQLT8MqYCI9zqcNihmTqfYAMl1O8zWqeN8IXX6LmAAgQyBw2OIif" />

</div>
    <div class="page">
        <div class="header">
            <div class="title">
                <h1>
                    My ASP.NET Application
                </h1>
            </div>
            <div class="loginDisplay">
                
                        [ <a href="Account/Login.aspx" id="HeadLoginView_HeadLoginStatus">Log In</a> ]
                    
            </div>

            <div class="clear hideSkiplink">
                <a href="#NavigationMenu_SkipLink"><img alt="Skip Navigation Links" src="/WebResource.axd?d=hpNQPuFcU3gxtyzz9kPxscxOz3VadQB_812sVxK0ngJavQi9s8rB-C9ONaEdo-Wa0yjAfGH8-vNZApeQjk6QLa8mcBNxYg5OrS22Zsux0to1&amp;t=634568724389128140" width="0" height="0" style="border-width:0px;" /></a><div class="menu" id="NavigationMenu">
	<ul class="level1">
		<li><a class="level1" href="Default.aspx">Home</a></li><li><a class="level1" href="About.aspx">About</a></li>
	</ul>
</div><a id="NavigationMenu_SkipLink"></a>
            </div>
        </div>

        <div class="main">
            

<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>

<script language="javascript" type="text/javascript">

    $(document).ready(function () {
        alert("hello");

        $('div#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]', 'enabled', 'false');


        $('div#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]').each(function (index, value) {
            alert(index + ' : ' + value);
        });

        alert("disabled all");
    });


</script>
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>.
    </p>

    <p>
        You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&amp;clcid=0x409"
            title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
    </p>
<table>
<div id="MainContent_ValidateContainer">
<tr>
<td>
<label for="MainContent_TextBox1" id="MainContent_Label1">One</label>
<input name="ctl00$MainContent$TextBox1" type="text" id="MainContent_TextBox1" />
<span id="MainContent_RequiredFieldValidator1" style="visibility:hidden;">RequiredFieldValidator</span>
</td>

</tr>
<tr>
<td>
<label for="MainContent_TextBox2" id="MainContent_Label2">Two</label>
<input name="ctl00$MainContent$TextBox2" type="text" id="MainContent_TextBox2" />
<span id="MainContent_RequiredFieldValidator2" style="visibility:hidden;">RequiredFieldValidator</span>
</td>
</tr>
</div>
<tr>
<td>
<label for="MainContent_TextBox3" id="MainContent_Label3">Three</label>
<input name="ctl00$MainContent$TextBox3" type="text" id="MainContent_TextBox3" />
<span id="MainContent_RequiredFieldValidator3" style="visibility:hidden;">RequiredFieldValidator</span>

</td>
</tr>
</table>
<input type="submit" name="ctl00$MainContent$Button1" value="Save" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$Button1&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="MainContent_Button1" />
<br />
<span id="MainContent_Label4"></span>

        </div>
        <div class="clear">
        </div>
    </div>
    <div class="footer">

        
    </div>
    
<script type="text/javascript">
//<![CDATA[
var Page_Validators =  new Array(document.getElementById("MainContent_RequiredFieldValidator1"), document.getElementById("MainContent_RequiredFieldValidator2"), document.getElementById("MainContent_RequiredFieldValidator3"));
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var MainContent_RequiredFieldValidator1 = document.all ? document.all["MainContent_RequiredFieldValidator1"] : document.getElementById("MainContent_RequiredFieldValidator1");
MainContent_RequiredFieldValidator1.controltovalidate = "MainContent_TextBox1";
MainContent_RequiredFieldValidator1.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator1.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator1.initialvalue = "";
var MainContent_RequiredFieldValidator2 = document.all ? document.all["MainContent_RequiredFieldValidator2"] : document.getElementById("MainContent_RequiredFieldValidator2");
MainContent_RequiredFieldValidator2.controltovalidate = "MainContent_TextBox2";
MainContent_RequiredFieldValidator2.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator2.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator2.initialvalue = "";
var MainContent_RequiredFieldValidator3 = document.all ? document.all["MainContent_RequiredFieldValidator3"] : document.getElementById("MainContent_RequiredFieldValidator3");
MainContent_RequiredFieldValidator3.controltovalidate = "MainContent_TextBox3";
MainContent_RequiredFieldValidator3.errormessage = "RequiredFieldValidator";
MainContent_RequiredFieldValidator3.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
MainContent_RequiredFieldValidator3.initialvalue = "";
//]]>
</script>

<script type='text/javascript'>new Sys.WebForms.Menu({ element: 'NavigationMenu', disappearAfter: 500, orientation: 'horizontal', tabIndex: 0, disabled: false });</script>
<script type="text/javascript">
//<![CDATA[

var Page_ValidationActive = false;
if (typeof(ValidatorOnLoad) == "function") {
    ValidatorOnLoad();
}

function ValidatorOnSubmit() {
    if (Page_ValidationActive) {
        return ValidatorCommonOnSubmit();
    }
    else {
        return true;
    }
}
        //]]>
</script>
</form>
</body>
</html>

Open in new window

0
StingRaYCommented:
First, your html structure is broken. You place div#MainContent_ValidateContainer inside <table> but place </div> after </table>.

Second, I don't think

$('div#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]', 'enabled', 'false');

Open in new window


is correct. Try:

$('div#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'false');

Open in new window


, if you want to add an attribute to your validator.
0
purplesoupProgrammerAuthor Commented:
The div starts after the <table> and finishes after the second row - so it just marks off the first two rows of the table.

I made the suggested attr(..) change and it hasn't made any difference, thanks.

        $('div#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'false');
0
StingRaYCommented:
Weird. When I moved the div out of the table, it works.
0
purplesoupProgrammerAuthor Commented:
Incidentally, removing the div selector part seems to get something working. If I try

        $('span[id^="MainContent_RequiredFieldValidator"]').each(function (index, value) {
            alert(index + ' : ' + value);
        });

it does cause the validators to appear, however neither

        $('span[id^="MainContent_RequiredFieldValidator"]','enabled', 'false');

nor

        $('span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'false');


will disable all the validators
0
StingRaYCommented:
Try this code to enable or disable your validators:

        // disable them ALL
        $('span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'false');

        // enable them ALL
        $('span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'true');

        // select ALL enabled validators
        $('span[id^="MainContent_RequiredFieldValidator"][enabled!="false"]').each(function (index, value) {
            alert(index + ' : ' + value);
        });

Open in new window


OR to disable any validators via HTML, just put an attribute named enabled like this:
<span id="MainContent_RequiredFieldValidator1" style="visibility:hidden;" enabled="false">RequiredFieldValidator</span>

Open in new window


or remove the attribute to enable it.
0
purplesoupProgrammerAuthor Commented:
Well I'm not clear how your suggestion that

$('span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'false');

would disable them all was different to my earlier comment that

$('span[id^="MainContent_RequiredFieldValidator"]').attr('enabled', 'false');

hadn't disabled all the validators, however I tried it again but with the same result - the validators still fired on clicking the "save" button.

I also tried

$('span[id^="MainContent_RequiredFieldValidator"][enabled!="false"]').each(function (index, value)

which interestingly did appear to respond based on whether enabled was set or not in the earlier statement, however this didn't actually disable the validators, they still fired on clicking save.

I then tried the following code:

        $('span[id^="MainContent_RequiredFieldValidator"][enabled!="false"]').each(function (index, value) {            
            value.enabled = false;
        });

and this did actually work - the validators didn't stop the save button from re-loading the page, so they were successfully disabled.

So for some reason the JQuery enabled attribute isn't doing the same thing as the .enabled property.

Also we still have the problem of selecting a group of validators within a div.

        $('div#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]').each(function (index, value) {
            alert(index + ' : ' + value);
        });

still isn't finding anything on the page.
0
StingRaYCommented:
After some experimental, you cannot put <div> inbetween <table> and <tr>.

Try this to see what I mean:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
    $(document).ready(function () {

        alert($('#targetblock td').attr('bgcolor'));
        alert($('td').attr('bgcolor'));
    });
  </script>
</head>
<table>
	<div id="targetblock">
		<tr>
			<td bgcolor="blue">Sample Block</td>
		<tr>
	</div>
	<tr>
		<td bgcolor="green">Another block</td>
	</tr>
</table>

Open in new window


First alert says "undefined", while the second says "blue".
0
StingRaYCommented:
To make it works, try using <tbody> instead of <div>. Hence:

<table>
<tbody id="MainContent_ValidateContainer">
<tr>
<td>
<label for="MainContent_TextBox1" id="MainContent_Label1">One</label>
<input name="ctl00$MainContent$TextBox1" type="text" id="MainContent_TextBox1" />
<span id="MainContent_RequiredFieldValidator1" style="visibility:hidden;">RequiredFieldValidator</span>
</td>

</tr>
<tr>
<td>
<label for="MainContent_TextBox2" id="MainContent_Label2">Two</label>
<input name="ctl00$MainContent$TextBox2" type="text" id="MainContent_TextBox2" />
<span id="MainContent_RequiredFieldValidator2" style="visibility:hidden;">RequiredFieldValidator</span>
</td>
</tr>
</tbody>
<tbody>
<tr>
<td>
<label for="MainContent_TextBox3" id="MainContent_Label3">Three</label>
<input name="ctl00$MainContent$TextBox3" type="text" id="MainContent_TextBox3" />
<span id="MainContent_RequiredFieldValidator3" style="visibility:hidden;">RequiredFieldValidator</span>

</td>
</tr>
</tbody>
</table>

Open in new window


And use this to select the validator:

 $('tbody#MainContent_ValidateContainer span[id^="MainContent_RequiredFieldValidator"]').each(function (index, value) {
            alert(index + ' : ' + value);
        });

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
purplesoupProgrammerAuthor Commented:
Ah - well done - I think we are there, that's great - thanks for all your help and sticking with it, I appreciate it.
0
purplesoupProgrammerAuthor Commented:
Thanks again
0
StingRaYCommented:
You're welcome :)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.