client validation on click of checkbox in a nested repeater

I have a repeater which shows current month records from database based upon month and year selection from dropdownlist at the top of page. This repeater has 3 textboxes per row  (date of month) and a nested repeater. Nested repeater contains checkbox and is populated from database. I want to make sure using javascript and custom validators that at least one checkbox in each row should be selected.
LVL 12
Munawar HussainPrincipal Software EngineerAsked:
Who is Participating?
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.

techExtremeCommented:
Hello,
Looking from your description, you seem to have
for each outer repeater item,
  you hav 3 textboxes  and 1 child repeater  (which further down contains 1 checkbox).

But this means you only have 1 checkbox per item.
And you want to ensure all of these are selected?
I guess I'm missing something out here.
0
Munawar HussainPrincipal Software EngineerAuthor Commented:
In child repeater I have list of checkboxes and one of those checkboxes should be checked.
0
techExtremeCommented:
Hello,
Got it, I have created a sample javascript for you, just paste it as a .html file and run locally and try pressing the submit button without selecting checkboxes in each row, it will give error and tell you that you have to select these many checkboxes atleast i.e. once per each row.

This is html and javascript , but looking at the code and html I have produced, you can easily port it in your repeater, just make sure you keep ids properly and change variables accordingly in this script.

Hope it solved your problem.

Happy Javascripting!

<html>
<body>
 
<form id="form1" >
<div id="_main" style="width:100px;">
 
<div id="div1" style="background-color:Gray;">
	<input type="CHECKBOX" id="chk_1" value="This...">
	<input type="CHECKBOX" id="chk_2" value="This...">
	<input type="CHECKBOX" id="chk_3" value="This...">
</div>
Group 2
 
<div id="div2" style="background-color:Gray;">
	<input type="CHECKBOX" id="chk_1" value="This...">
	<input type="CHECKBOX" id="chk_2" value="This...">
	<input type="CHECKBOX" id="chk_3" value="This...">
</div>
 
 
<input type="hidden" id="hdn1" value="div1,div2">
</div>
 
<input type="submit" value="submit" onclick="checkform()" >
</form>
</body>
</html>
 
<script type="text/javascript">
 
function checkform()
{
  var v_main  = document.getElementById("_main");
  var v_sub = v_main.getElementsByTagName('div');
  
  var i=0;
  var faultCounter=0;
  while(i<v_sub.length)
  {	
	var v_sub2 = v_sub[i].getElementsByTagName('input');
	var innerChecked=0;
        j=0;
	while(j<v_sub2.length)
	{
		if(v_sub2[j].checked==true)
		{
			innerChecked=1;
		}	
		j++;
	}
	
	if(innerChecked==0) //i.e. no checkbox is checked
	{
	  faultCounter = faultCounter + 1;
	}
	i++;
  }
 
  if (faultCounter>0)
  {
    alert("Atleast select one checkbox frome each row, " + faultCounter + " checkbox needs to be selected yet.");
  }
  else
  {
	alert("All O.K.");
  }
}
 
 
</script>

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
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

techExtremeCommented:
Also forgot to mention, after you get familiar with the script I posted above,
you will notice tht
there should be one single outer div element,

then elements like div1, div2 ... can probably be once per itemtemplate of repeater,
i.e. if you have two dataitems, you should render div1,div2...  , if you have three dataitems, your repeater shoudl produce div1,div2,div3 like that.

Now inside of these divs (div1, div2... ) you can have your checkboxes.
ids of checkboxes doesn't matter as of now.


You can use this logic with two repeaters, or 1 repeater,
its just how you arrange the divs and how they render dynamically!
0
Munawar HussainPrincipal Software EngineerAuthor Commented:
Hi techExtreme,

    Thanks for your time. I pasted above code in html file but when I click one checkbox from one row and dont check any from other row It prompts me with alert and then the checkbox I checked also looses selection. Why so ?

Regards,
Asif Hameed
0
techExtremeCommented:
Its just html buddy. Once you prepare it with dynamic code and in aspx page , the session will be maintained there.
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.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.