Hi Everyone
In a html document I declare several input tags.
They all have the attribute name="input[]".
So when they are intialized as input[0], input[1], etc.
Now after they have been intialized I want to be able to access them using Javascript.
How would I do this?
The usual code in javascript is not working:
form.field.value.attributeThanks, Regards X
If you want to access the value of input element "input[n]" try document.forms[formName].elements["input[n]"].value If you want the names of all the input elements, try:
function getInputNames(frm) {
var arr = [];
var elms = frm.getElementsByTagName("input");
for(var i = 0, max = elms.length; i < max; ++i) {
arr[i] = elms[i].name;
}
return(arr);
}Read the Javascript FAQ for more details.
Ya I researched the first line but that wasnt working for me: eg.
document.forms[form_input].elements["input[0]"].value.length == 0Thats what I am using there any problems?
Thanks, Regards X
PS: Thanks for the names function ill keep that in mind if i need it, atm just need to refer to one of the elements in the array.
Is form_input the variable holding the form name or is it the form name? If it's the form name, you need to enclose it in double quotes. If it still doens't work, test the page in Firefox, look at the error console and let me know what it says.
If your fields have names such as "input[]", you do not need to provide any numbers inside the brackets. That naming convention (adding brackets at the end of the field name, is necessary for PHP processing, but on the client-side, those brackets are part of the name). Refer to the full example below:
<!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>
</style>
<script language="JavaScript" type="text/JavaScript">
function toggle(status){
var chk = document.getElementsByName("ad_pages[]");
for(var i=0,limit=chk.length; i < limit; ++i)
{
chk[i].checked = !chk[i].checked;
}
}
</script>
</head>
<body> <form>
<table border="0" align="center" cellpadding="3" cellspacing="3" bgcolor="#F3F3F3">
<tr>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="1" ></label></td>
<td width="180"> English</td>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="2" ></label></td>
<td width="180">Maths</td>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="3" ></label></td>
<td width="180">Science</td>
<td width="10"><label><input name="ad_pages[]" type="checkbox" id="ad_pages[]" value="4" ></label></td>
<td width="180">Technology</td>
</tr>
</table>
<table width="500" border="0" align="center" cellpadding="5" cellspacing="5">
<tr>
<td><div align="center">
<input name="toggleAll" type=button class="formbutton" onClick="toggle()" value="Toggle All">
</div></td>
</tr>
</table></form>
</body>
</html>Sorry about the late reply but had commitments at work but still no luck getting this working.
I try running it and it just bypasses the javascript syntax.
I tried both solutions and neither worked.
document.forms["form_input"].elements["input[0]"].value.length == 0Maybe If i simplify it down:
1. I have multiply input file boxes with the same name
2. I need to ONLY refer to the first input file
3. I need to check if that input file has a file selected in it (aka TEXT aka LENGTH)
4. Help me please =(
Thanks, Regards X
I am confused here, maybe you should paste the markup (HTML) next time so we have a clear view of what we are dealing with here.
Do you have a markup like this?
<input name="input[]">
<input name="input[]">or like this?
<input name="input[0]">
<input name="input[1]">If it's the latter, then what I have posted should work. You get hold of the first input element using document.forms[0].elements["input[0]"] . But if it's the former, there is no unique way of accessing the input element. That is possible only if you have an element with a unique id or a unique name. In that case, you do something like:
var els = document.getElementsByName("input[]"); // See this
for(var i = 0, max = els.length; i < max; ++i) {
/* access the input elements using the index i. */
}latter = after?
former = previous?
Going on that assumption I presume.
The HTML mark up I am using is like the one you refered to as "former":
<input name="input[]">
<input name="input[]">So I assuming the below code should work?
Is this correct? as I plan to try it once I am at home.
var els = document.getElementsByName("input[]"); // See this
for(var i = 0, max = els.length; i < max; ++i) {
/* access the input elements using the index i. */
/* The code I would have here is ? */
els[i].value.length = 0;
}Thanks for all the help, much appericated.
Regards, X
Looks good except for the thing that you don't explicitly set the length of the string since it's a read only property and would have no effect. Instead set the value of the form element to an empty string. Something like els[i].value = '';
Didnt get home till late last night, didnt get a chance to test it hopefully I get time to tonight.
The code I will be testing is:
var els = document.getElementsByName("input[]"); // See this
for(var i = 0, max = els.length; i < max; ++i) {
/* access the input elements using the index i. */
/* The code I would have here is ? */
els[i].value = "";
}Thanks for all the help SOS, ill check it tonight and keep you informed.
Worked Perfectly!!! (sorta just one minor error the value = "" should be value == "")
Thanks for all the help SOS.
Much Appericated, Regards X =)
You are welcome. :-)
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.