Solved

Find control recursively using JavaScript

Posted on 2010-09-22
9
619 Views
Last Modified: 2012-05-10
Hi,

I want to find a control recursively using JavaScript. The function will take the  "ParentControl", "ChildControlType" and "ChildControlValue" as parameters and returns control. Now it will search the "ParentControl" for it's all child controls recursively and get the required child control. Can you please provide me the required "JavaScript" function for this ?

Thanks
0
Comment
Question by:milani_lucie
  • 4
  • 2
  • 2
  • +1
9 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 33740294
Something like :


function findControl(ParentControl, ChildControlType, ChildControlValue) {
	   var c = ParentControl.getElementsByTagName("*");
	   for(var i=0;i<c.length;i++) {
		   if( (c[i].tagName.toLowerCase() == ChildControlType.toLowerCase()) && (c[i].getAttribute("value") == ChildControlValue) ) {
			//   alert("found!");
			   return c[i];
		   }
	   }
	}

Open in new window

0
 
LVL 41

Expert Comment

by:HonorGod
ID: 33740295
Is this homework?
0
 
LVL 82

Assisted Solution

by:leakim971
leakim971 earned 250 total points
ID: 33740297
test page :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
	function findControl(ParentControl, ChildControlType, ChildControlValue) {
	   var c = ParentControl.getElementsByTagName("*");
	   for(var i=0;i<c.length;i++) {
		   if( (c[i].tagName.toLowerCase() == ChildControlType.toLowerCase()) && (c[i].getAttribute("value") == ChildControlValue) ) {
			//   alert("found!");
			   return c[i];
		   }
	   }
	}
</script>
</head>
<body onload="findControl(document.getElementById('pc'), 'select', 'here');" >
<div id="pc">
<div><input /><select value="not me"></select></div>
<div><textarea ></textarea><select value="here"></select></div>
</div>
</body>
</html>

Open in new window

0
Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

 

Author Comment

by:milani_lucie
ID: 33740361
HonorGod:
This is not homework. I am working on a project which needs this.
Thanks
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 33740394
I would suggest that you check out the solution provided by leakim971, as you can see from his ranking in this zone, he is exceptional.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33740429
@HonorGod thank you so much for your compliment. Have fun!
0
 
LVL 10

Accepted Solution

by:
bugada earned 250 total points
ID: 33743285
Ok leakim, I agree you are exceptional, but i have slighty changed your code to make it compatibile with IE.
On IE7 and older:

- getElementsByTagName("*") is broken
- the attribute "value" cannot be read using getAttribute

Just my 2 cents.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
	function findControl(ParentControl, ChildControlType, ChildControlValue) {
	   var c = ParentControl.all ? ParentControl.all : ParentControl.getElementsByTagName("*");
	   for(var i=0;i<c.length;i++) {
		   if( (c[i].tagName.toLowerCase() == ChildControlType.toLowerCase()) && (c[i].getAttribute("myvalue") == ChildControlValue) ) {
			   alert("found!");
			   return c[i];
		   }
	   }
	}
</script>
</head>
<body onload="findControl(document.getElementById('pc'), 'select', 'here');" >
<div id="pc">
<div><input /><select myvalue="not me"></select></div>
<div><textarea ></textarea><select myvalue="here"></select></div>
</div>
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:milani_lucie
ID: 33765879
Works fine in all the browsers.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 33765887
Thanks for the points!
@bugada thanks for the infos!
0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Master Content Pages, WebForms, and Session Variables 1 43
jQuery Validate 4 36
Java script read and write file - save as location 8 42
How to show span when clicked on? 10 19
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

816 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now