JavaScript - Loop through the controls in the form

Asked By mostafa hamdy on 31-Jan-07 06:13 AM

Hello  All

I want to loop through all the controls of my web form using javascript, and also I get the type of the control like button,textbox...

please if any body knows that and can help me in that please send me

regards

Mostsafa

use this loop to find control in aspx page - K Pravin Kumar Reddy replied to mostafa hamdy on 31-Jan-07 06:23 AM

Control oFrm = Page.Form;
//loop through panel controls
foreach (Control oCtl in oFrm.Controls)
  {
   //find your control and do with it as you like here
   .....
  }

JavaScript: Loop through all elements in a form - K Pravin Kumar Reddy replied to mostafa hamdy on 31-Jan-07 06:28 AM

 

Since I've been doing alot of JavaScript programming lately, I figured I could start blogging some code snippets. Here is a JavaScript snippet that shows how to loop through all the elements in a form and retrieve their element type, name and values. I had to use this code to gather all form values so I could post them to the server using AJAX.

<html>
<
head>
<
script type="text/javascript">
function
DisplayFormValues()
{
var str = '';
var elem = document.getElementById('frmMain').elements;
for(var i = 0; i < elem.length; i++)
{
str +=
"<b>Type:</b>" + elem[i].type + "&nbsp&nbsp";
str +=
"<b>Name:</b>" + elem[i].name + "&nbsp;&nbsp;";
str +=
"<b>Value:</b><i>" + elem[i].value + "</i>&nbsp;&nbsp;";
str +=
"<BR>";
}
document.getElementById(
'lblValues').innerHTML = str;
}
</script>
</
head>
<
body>
<
form id="frmMain" name="frmMain">
<input type="hidden" name="ElemHidden" value="some hidden text" />
<input type="text" name="ElemText" value="some text" /><br />
<textarea name="ElemTextArea">Some text area text</textarea><br />
<br />
<input type="button" value="Test" onclick="DisplayFormValues();" />
</form>
<
hr />
<div id="lblValues"></div>
</
body>
</
html>

reference

http://pietschsoft.com/Blog/Post.aspx?PostID=1303

http://www.developertutorials.com/tutorials/javascript/looping-through-form-elements-javascript-051209/page1.html

Finding all controls on the forms - Prem Pandey replied to mostafa hamdy on 18-Jul-08 02:44 AM

try this,

<html>
<head>
<script type="text/javascript">
function DisplayFormValues()
{
var str = '';
var elem = document.getElementById('frmMain').elements;
for(var i = 0; i < elem.length; i++)
{
str += "<b>Type:</b>" + elem[i].type + "&nbsp&nbsp";
str += "<b>Name:</b>" + elem[i].name + "&nbsp;&nbsp;";
str += "<b>Value:</b><i>" + elem[i].value + "</i>&nbsp;&nbsp;";
str += "<BR>";
}
document.getElementById('lblValues').innerHTML = str;
}
</script>
</head>
<body>
<form id="frmMain" name="frmMain">
<input type="hidden" name="ElemHidden" value="some hidden text" />
<input type="text" name="ElemText" value="some text" /><br />
<textarea name="ElemTextArea">Some text area text</textarea><br />
<br />
<input type="button" value="Test" onclick="DisplayFormValues();" />
</form>
<hr />
<div id="lblValues"></div>
</body>
</html>

I hope It works for you

Re :: Loop through the controls in the Web Form using Javascript - Shailendrasinh Parmar replied to mostafa hamdy on 25-Nov-08 07:04 AM

See the following function to get the element type in the Web Form

function ControlTypes()
{
      for (i=0; i<document.forms[0].length; i++)
      {
            doc = document.forms[0].elements[i];
            var type = doc.type;
      }       
}

Hope this helps.