473,750 Members | 2,458 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

How to reference by id more elements with the same id?

Hi everybody, I need to do a function in javascript to check or
uncheck all checkboxes with the same id. I want this function to work
in every form and every page of my site, as I will use the same id
("sel") for all checkboxes in the site. So I need to refer to these by
id.
I tried with:
document.getEle mentById("sel")
but this returns only the reference to the first element.
Does anyone know how I can do?

This is the typical situation of the checkboxes:

<form name="form1" method="post" action="">
<table>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="1"></td>
<td>First row</td>
</tr>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="6"></td>
<td>Second row</td>
</tr>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="5"></td>
<td>N row</td>
</tr>
</table>
<input type="button" value="Select all" onClick="select ('A');">
<input type="button" value="Select nothing" onClick="select ('N');">
</form>

thanks,

AM
Jul 23 '05 #1
4 27932
Logico napisał(a):
Hi everybody, I need to do a function in javascript to check or
uncheck all checkboxes with the same id. [...] I will use the same id ("sel") for all checkboxes in the site


[snip]

None of the elements in a HTML document body may have two identical ids.
I suggest further reading about (x)html attrributes.

--
tomasz cenian tcenian at wa dot home dot pl
:::: :: : : http://cenian.boo.pl : : :: ::::
Jul 23 '05 #2
"Logico" <am*****@dsi.un ive.it> wrote in message
news:ff******** *************** **@posting.goog le.com...
Hi everybody, I need to do a function in javascript to check or
uncheck all checkboxes with the same id. I want this function to work
in every form and every page of my site, as I will use the same id
("sel") for all checkboxes in the site. So I need to refer to these by

<snip>

Element IDs must be unique to each page but you can assign them each the
same class and reference by that instead. I think the class can be empty so
it needn't upset your current styling.

Alternatively number the IDs sequentially and reference them with a simple
javascript loop.
Jul 23 '05 #3
"Logico" <am*****@dsi.un ive.it> wrote in message
news:ff******** *************** **@posting.goog le.com...
Hi everybody, I need to do a function in javascript to check or
uncheck all checkboxes with the same id. I want this function to work
in every form and every page of my site, as I will use the same id
("sel") for all checkboxes in the site. So I need to refer to these by
id.
I tried with:
document.getEle mentById("sel")
but this returns only the reference to the first element.
Does anyone know how I can do?

This is the typical situation of the checkboxes:

<form name="form1" method="post" action="">
<table>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="1"></td>
<td>First row</td>
</tr>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="6"></td>
<td>Second row</td>
</tr>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="5"></td>
<td>N row</td>
</tr>
</table>
<input type="button" value="Select all" onClick="select ('A');">
<input type="button" value="Select nothing" onClick="select ('N');">
</form>

thanks,

AM


Will this help? Watch for word-wrap.

The function was renamed to "selects()" as "select()" wouldn't work as it's
a reserved word.

<html>
<head>
<title>selects. htm</title>
<script type="text/javascript">
function selects(what) {
var form = document.form1;
for (var i=0; i<form.elements .length; i++) {
if (form.elements[i].type == "checkbox") {
if (what == 'A') {
form.elements[i].checked = true;
} else {
form.elements[i].checked = false;
}
}
}
}
</script>
</head>
<body>
<form name="form1" method="post" action="">
<table>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="1"></td>
<td>First row</td>
</tr>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="6"></td>
<td>Second row</td>
</tr>
<tr>
<td><input name="sel" type="checkbox" id="sel" value="5"></td>
<td>N row</td>
</tr>
</table>
<input type="button" value="Select all" onClick="select s('A');">
<input type="button" value="Select nothing" onClick="select s('N');">
</form>
</body>
</html>
Jul 23 '05 #4
Logico wrote:
Hi everybody, I need to do a function in javascript to check or
uncheck all checkboxes with the same id.


[snip]

What others have said is correct: every id in a document must be
unique. Your mark-up is invalid otherwise.

Though you could change the id values or use classes, as previously
suggested, there's no need: use the identical name attributes (which
is perfect valid) instead. There are two approaches:

1) The elements collection:

var collection = form.elements['sel'];

2) The getElementsByNa me method:

var collection = document.getEle mentsByName('se l');

Both return a collection (effectively, a reduced capability array)
that you may iterate through. The distinction between the two is
mainly one of scope: the elements collection will return only matching
elements within the form, whilst the getElementsByNa me method will
return matching elements throughout the document. You'll probably want
the former.

Note that elements other than checkboxes may be returned if other
elements have a matching name. You may need to check the type of
element before manipulating it. If the elements are guaranteed to be
homogeneous, there's no need. Also be aware that the elements
collection also return elements based on id attributes, but that is no
reason to keep using duplicated id values.

How you get a reference to the form will vary. The document.forms
collection is obvious, but if the code is activated by another control
- for example, another control within the form - then there is a more
direct alternative:

<input type="checkbox" onclick="select All(this.form); ">

function selectAll(form) {
/* ... */
}

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
1603
by: Kjell Breimo | last post by:
Hi, I have made a selectbox (<Select....><option...>...) with size=1(It has to be size=1). It contains about 40 elements. It is placed on the top of my webpage abd I would like to see as many elements as possible when it is opened. As default there is only 12 elements that shows and then I have to scroll down to the other 28 elements. Is there a way to set the selectbox to show more than 12 elements when its opened?
3
2660
by: vikenk | last post by:
Hello, This is my first post to this group. A little background first: I'm not not new to web-design, but new to manual coding :>) I'm trying to move from total dependence on FrontPage to more manual coding and positioning. So far I think I've done OK for a newbie (you can go to http://home.comcast.net/~vikenk to see my latest site, which is based mostly on a CSS). But now I have a question: I'm trying to position a Java Applet using...
2
1371
by: colin.steadman | last post by:
I often use the HTML reference guide at Microsoft which is located here: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/html/reference/elements.asp It gives a descriptions and examples of HTML elements. Can anyone point me at any similar resources for Javascript? TIA,
5
2444
by: Dani | last post by:
Hello everybody, I have some code that disables form elements on body load, but I notice when I hit the "back" button, I need to re-enable the form elements (that is done by clicking on a radial button). Is there any way I can keep the form for disabling every time a user hits the back button and "remember" what elements should be enabled? I was thinking maybe utilizing some referrer thing, but I'm not that good with JS yet. Thanks...
8
1882
by: wASP | last post by:
Hi, I'm having a problem referencing the elements within an object after a method of that object (a member function) has been activated with an onsubmit handler: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <script language="javascript" type="text/javascript"> function js_onsubmit_hndl_fn () {
0
5114
by: Richard Gregory | last post by:
Hi, I have the wsdl below, for an Axis web service, and when I select Add Web Refernce in Visual Studio the proxy is missing a class representing the returnedElementsType (see reference.cs below the wsdl). This complex type is a collection of another complex type(elementType), and the Reference.cs has an array of these rather than the single returnedElementsType. If If I want to be able to obtain these elements from the SOAP response I...
29
3648
by: shuisheng | last post by:
Dear All, The problem of choosing pointer or reference is always confusing me. Would you please give me some suggestion on it. I appreciate your kind help. For example, I'd like to convert a string to a integer number. bool Convert(const string& str, int* pData); bool Convert(const string& str, int& data);
2
2135
by: vunet.us | last post by:
Please, explain an interesting phenomenon, if you can. I have an array of references to an HTML element: <div id='container'> <div id='someId1'></div> <div id='someId2'></div> </div> ..... myArray = document.getElementById("someId1"); myArray = document.getElementById("someId2");
2
1572
by: Simon Brooke | last post by:
I have a document type which I'm developing and working with, which is currently defined in a DTD, mainly because I still haven't really learned to use schemas. In this document type I need to specify that some specific elements may have children which are XHTML %Flow; elements. It isn't valid for these elements to contain arbitrary XHTML, and it isn't valid for other elements in my language to have any XHTML children. I presume I can't...
0
2359
by: AK | last post by:
Hello, I need to do the following with an xml document which has a list of assets: 1. Hash the assets 2. Hash the element describing the assets 3. Create a digital signature (using X.509 certificate) over the hashes from step 1 and 2 Most of the examples I've been looking at are doing a digital
0
9584
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9399
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
9259
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8266
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6817
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
4717
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4895
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
3328
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
2811
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.