471,338 Members | 1,308 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,338 software developers and data experts.

Checkbox

How can I, on button click, to select ONLY the following 4 checkbox?

I would like to do this without a for loop through form.lenght because
this is only an example and I have to apply this script on a 10k+ lines
page and IE, looping through a form with 20k+ elements is VERY SLOW.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form name="form1" method="post" action="">
<input type="button" name="Submit" value="Select"
onclick="sel(next_four_elements);">
<input type="checkbox" name="1">
<input type="checkbox" name="2">
<input type="checkbox" name="3">
<input type="checkbox" name="4">
<br>
<br>
<input type="button" name="Submit" value="Select"
onclick="sel(next_four_elements);">
<input type="checkbox" name="5">
<input type="checkbox" name="6">
<input type="checkbox" name="7">
<input type="checkbox" name="8">
</form>
</body>
</html>
I was thinking about

<pseudo-code>

function sel(w){
/* select following 4 elements after you */
}

</pseudo-code>
Any help much appreciated.

Regards.

--
Fabri
(Incredibile come si tenda a credere di piu` a Rossi. (cit.))
Jul 23 '05 #1
4 1864
"Fabri" <no@sp.am> wrote in message news:32*************@individual.net...
How can I, on button click, to select ONLY the following 4 checkbox?

I would like to do this without a for loop through form.lenght because
this is only an example and I have to apply this script on a 10k+ lines
page and IE, looping through a form with 20k+ elements is VERY SLOW.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<form name="form1" method="post" action="">
<input type="button" name="Submit" value="Select"
onclick="sel(next_four_elements);">
<input type="checkbox" name="1">
<input type="checkbox" name="2">
<input type="checkbox" name="3">
<input type="checkbox" name="4">
<br>
<br>
<input type="button" name="Submit" value="Select"
onclick="sel(next_four_elements);">
<input type="checkbox" name="5">
<input type="checkbox" name="6">
<input type="checkbox" name="7">
<input type="checkbox" name="8">
</form>
</body>
</html>
I was thinking about

<pseudo-code>

function sel(w){
/* select following 4 elements after you */
}

</pseudo-code>
Any help much appreciated.

Regards.

--
Fabri
(Incredibile come si tenda a credere di piu` a Rossi. (cit.))


Will this help? Watch for word-wrap.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function sel(beg,end) {
for (var i=beg; i<end+1; i++) {
document.getElementById(i).checked = true;
}
}
</script>
</head>
<body>
<form name="form1" method="post" action="">
<input type="button" value="Select" onclick="sel(1,4);">
<input type="checkbox" name="1">
<input type="checkbox" name="2">
<input type="checkbox" name="3">
<input type="checkbox" name="4">
<br>
<br>
<input type="button" value="Select" onclick="sel(5,8);">
<input type="checkbox" name="5">
<input type="checkbox" name="6">
<input type="checkbox" name="7">
<input type="checkbox" name="8">
</form>
</body>
</html>

You probably don't want
name="Submit"
on all of the buttons!
Jul 23 '05 #2
On Fri, 17 Dec 2004 13:09:17 +0100, Fabri <no@sp.am> wrote:
How can I, on button click, to select ONLY the following 4 checkbox?


If you're only concerned with IE (5+) then

/* getNextElement(o, t)
*
* This moves from sibling node to sibling node trying to find
* elements. The returned elements can be restricted by name.
*
* Input:
* o - The position within the tree where the search will begin.
* This node will not be returned as a match.
* t - An optional string that specifies the name of an element
* type. Only these elements will be returned. If any element
* should be matched, either pass null or nothing at all.
*
* If no matching siblings are found, the return value is null.
*
* Note: If t is a string, it will be converted to uppercase before
* being compared to a node. That makes this particular
* version unsuitable for XML documents without modification.
*/
var getNextElement = (function() {
function isS(o) {return 'string' == typeof o;}
function isE(o, t) {var r;
if((r = (o.nodeType == 1))) {
if(isS(t)) {r = (o.nodeName == t);}
}
return r;
}
return function(o, t) {
if(!o) {return null;}
if(t) {t = String(t).toUpperCase();}
do {o = o.nextSibling;} while(o && !isE(o, t));
return o;
};
})();

function sel(node) {
for(var i = 0; (i < 4) && node; ++i, node = getNextElement(node)) {
node.checked = true;
}
}

called with

<input type="button" ... onclick="sel(this);">

will suffice. It will also work with other browsers, but it wouldn't be
quite so appropriate on the Web.

[snip]

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Jul 23 '05 #3
Michael Winter wrote:
[snip]

Hope that helps,
Mike


Wow. :-)

--
Fabri
(Incredibile come si tenda a credere di piu` a Rossi. (cit.))
Jul 23 '05 #4
JRS: In article <32*************@individual.net>, dated Fri, 17 Dec
2004 13:09:17, seen in news:comp.lang.javascript, Fabri <no@sp.am>
posted :
How can I, on button click, to select ONLY the following 4 checkbox?


This is like yours, but the boxes are renamed and sel() takes a
parameter :-

<form name="form1" method="post" action="">
<input type="button" name="Submit" value="Select"
onclick="sel('x');">
<input type="checkbox" name="x0">
<input type="checkbox" name="x1">
<input type="checkbox" name="x2">
<input type="checkbox" name="x3">
<br>
<br>
<input type="button" name="Submit" value="Select"
onclick="sel('y');">
<input type="checkbox" name="y0">
<input type="checkbox" name="y1">
<input type="checkbox" name="y2">
<input type="checkbox" name="y3">
</form>

<script>
function sel(z) { var j
for (j=0;j<4;j++) form1.elements[z+j].checked=true }
</script>

Works in IE4 (in my js-quick.htm, naturally); AFAIK, should work in
others.

--
John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4
<URL:http://www.jibbering.com/faq/> JL/RC: FAQ of news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
Jul 23 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

reply views Thread by mike | last post: by
2 posts views Thread by bebop | last post: by
5 posts views Thread by DotNetJunkies User | last post: by
2 posts views Thread by Adam Knight | last post: by
2 posts views Thread by Ceema M via DotNetMonster.com | last post: by

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.