473,846 Members | 1,914 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Help with tricky "select all" problem

In reference to the following:

http://www.bellecose.com/form.htm

At the top of each column there is a box for "All".

When one is checked I need to check all of (and only) those boxes
underneath.

Now, the rub here is that every checkbox on the page (except the "All"s)
are coded like this:

<input type="checkbox" name="search" value="Rattan">

Well, they don't all have the value "Rattan" obviously. That value changes
from box to box. What does not change is the name "search".

This is because every checkbox represents a keyword search in the form and
must be named "search" in order to have its value included in the search
process. Changing that is not an option.

I know how to do this to check ALL the boxes on the whole page by name.
But that won't work for this. How can I differentiate between just the
boxes below a particular "All"?

Can it be done by putting a particular columns checkboxes in their own
nested table and set its id and work off that? My searching for answers
hasn't yielded much just yet. Any help is appreciated.

Sep 22 '05 #1
3 2463
Oh also I need the All box to toggle on / off the others with check /
uncheck. In the last few minutes I have found some archive help thats
getting me there...

at*****@comcast .net (Adam Toline) wrote in
<96************ *******@216.196 .97.136>:
In reference to the following:

http://www.bellecose.com/form.htm

At the top of each column there is a box for "All".

When one is checked I need to check all of (and only) those boxes
underneath.

Now, the rub here is that every checkbox on the page (except the "All"s)
are coded like this:

<input type="checkbox" name="search" value="Rattan">

Well, they don't all have the value "Rattan" obviously. That value
changes from box to box. What does not change is the name "search".

This is because every checkbox represents a keyword search in the form
and must be named "search" in order to have its value included in the
search process. Changing that is not an option.

I know how to do this to check ALL the boxes on the whole page by name.
But that won't work for this. How can I differentiate between just the
boxes below a particular "All"?

Can it be done by putting a particular columns checkboxes in their own
nested table and set its id and work off that? My searching for answers
hasn't yielded much just yet. Any help is appreciated.


Sep 22 '05 #2
Adam Toline <at*****@comcas t.net> wrote:
I know how to do this to check ALL the boxes on the whole page by name.
But that won't work for this. How can I differentiate between just the
boxes below a particular "All"?


At least one (possibly poor) option is to give them all unique id's of
the form 'type-of-box'+number. You can then check the id of each
element when you loop through the array you obtain from
getElementsByNa me() and change only those boxes you're concerned with.

--
Christopher Benson-Manica | I *should* know what I'm talking about - if I
ataru(at)cybers pace.org | don't, I need to know. Flames welcome.
Sep 23 '05 #3
Adam Toline wrote:
Oh also I need the All box to toggle on / off the others with check /
uncheck. In the last few minutes I have found some archive help thats
getting me there...

at*****@comcast .net (Adam Toline) wrote in
<96************ *******@216.196 .97.136>:

In reference to the following:

http://www.bellecose.com/form.htm

At the top of each column there is a box for "All".

When one is checked I need to check all of (and only) those boxes
underneath.

Now, the rub here is that every checkbox on the page (except the "All"s)
are coded like this:

<input type="checkbox" name="search" value="Rattan">

Well, they don't all have the value "Rattan" obviously. That value
changes from box to box. What does not change is the name "search".

This is because every checkbox represents a keyword search in the form
and must be named "search" in order to have its value included in the
search process. Changing that is not an option.

I know how to do this to check ALL the boxes on the whole page by name.
But that won't work for this. How can I differentiate between just the
boxes below a particular "All"?

Can it be done by putting a particular columns checkboxes in their own
nested table and set its id and work off that? My searching for answers
hasn't yielded much just yet. Any help is appreciated.


There are many ways to do this, the basic methods are using divs to
create sets then display them as columns. The other is to use a table.

Your page fits both cases, take your pick - using divs is simpler from a
scripting standpoint but you may find learning the required CSS too
much. Using a table makes it a bit tougher, but not much.

I don't think you should use a checkbox for selecting all, nor should
checking 'none' cause the other sets to be cleared. The script below
clears the other sets only when 'all' is checked.

I've used divs and CSS to do the job, if you want to use a table then
you could work out which column you are in, then create sets of
checkboxes based on the columns. The advantage is that the design
floats, so if you reduce the window width the sets of checkboxes
re-align - try it and see.

You could also create arrays of references to the checkboxes onload,
then just loop through the arrays checking/unchecking as appropriate.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Demo</title>

<style type="text/css">

..titleD {
font-family: verdana, sans-serif;
font-size: 110%;
font-weight: bold;
color: white;
background-color: #336699;
text-align: center;
}
..buttonSet {
font-family: arial, sans-serif;
font-size: 75%;
color: #336699;
background-color: #f8fafc;
float: left;
border-right: 1px solid #336699;
width: 15em;
}

..clickable {
cursor: pointer;
padding-left: 5px;
}

</style>

<script type="text/javascript">

// Array of button set div ids
var divArray = ['set-1','set-2','set-3'];

// Sets the checked status of all the checkboxes in a group to state
// If state is false, other sets are not modified.
// If state is true, other sets are unchecked
function doChecks( el, state )
{
while (el.parentNode && 'div' != el.nodeName.toL owerCase()) {
el = el.parentNode;
}
if ('div' == el.nodeName.toL owerCase()){
var i = divArray.length ;
while ( i-- ){
if ( el.id && divArray[i] == el.id ){
checkGroup( el, state );
} else if ( state ) {
checkGroup( document.getEle mentById(divArr ay[i]), !state );
}
}
}
}

// Sets all of the checkboxes inside el to state
function checkGroup (el, state)
{
var inputs = el.getElementsB yTagName('input ');
var i = inputs.length;
while ( i-- ) {
if ( 'checkbox' == inputs[i].type ){
inputs[i].checked = state;
}
}
}

</script>
</head>
<body>

<div id="msg"></div>

<form action="">
<div>
<div id="set-1" class="buttonSe t">
<div class="titleD"> STYLE</div>
<span class="clickabl e" onclick="
doChecks(this, true);
"><b>Check all</b></span>&nbsp;/&nbsp;<span class="clickabl e"
onclick="doChec ks(this, false);
"><b>None</b></span><br>
<input type="checkbox" name="Search_se arch">Alabaster
/ Faux Alabaster<br>
<input type="checkbox" name="Search_se arch">Architect ural
/ Mission<br>
<input type="checkbox" name="Search_se arch">Art Deco
/ Craftsman / Retro<br>
<input type="checkbox" name="Search_se arch">Ceramic
/ Paintable / Porcelain<br>
</div>

<div id="set-2" class="buttonSe t">
<div class="titleD"> FINISH</div>
<span class="clickabl e" onclick="
doChecks(this, true);
"><b>Check all</b></span>&nbsp;/&nbsp;<span class="clickabl e"
onclick="doChec ks(this, false);
"><b>None</b></span><br>
<input type="checkbox" name="Search_se arch">Antique
/ Satin Brass<br>
<input type="checkbox" name="Search_se arch">Beige
/ White / Ivory<br>
<input type="checkbox" name="Search_se arch">Black
/ Iron<br>
<input type="checkbox" name="Search_se arch">Bronze
/ Rust<br>
</div>

<div id="set-3" class="buttonSe t">
<div class="titleD"> BRAND</div>
<span class="clickabl e" onclick="
doChecks(this, true);
"><b>Check all</b></span>&nbsp;/&nbsp;<span class="clickabl e"
onclick="doChec ks(this, false);
"><b>None</b></span><br>
<input type="checkbox" name="Search_se arch">Justice Design Group<br>
<input type="checkbox" name="Search_se arch">Kichler Lighting<br>
<input type="checkbox" name="Search_se arch">LBL Lighting<br>
<input type="checkbox" name="Search_se arch">PLC Lighting<br>
</div>

<input type="submit" value="Search for products"
style="float: left; clear: left; margin-top: 15px;">
</div>
</form>

</body></html>

--
Rob
Sep 23 '05 #4

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

Similar topics

23
5700
by: ian justice | last post by:
Before i post actual code, as i need a speedyish reply. Can i first ask if anyone knows off the top of their head, if there is a likely obvious cause to the following problem. For the moment i've reduced my form request to a simple text string entry, instead of my desired optional parameters. As i have been stuck with a single unfathomable glitch for over a year. Basically, if i enter queries such as ; "select * from table" "select * from...
3
2061
by: Jason | last post by:
I'm having some trouble coming up with the correct select statement. Lets say I have the following two tables: ---------------- ---------------- Orders OrderItem ---------------- ---------------- PK OrderID (int) PK OrderItemID (int) OrderDate (datetime) FK OrderID (int) CustomerName (nvarchar) Priority (int)
10
5644
by: serge | last post by:
Using "SELECT * " is a bad practice even when using a VIEW instead of a table? I have some stored procedures that are identical with the difference of one statement in the WHERE clause. If I create a single View and specify also in this View the WHERE clause that is common in these stored procedures, I will have the new stored procecures changed to be like:
1
4184
by: Andrew McNab | last post by:
Hi folks, I have a problem with an MS Access SQL query which is being used in an Access Report, and am wondering if anyone can help. Basically, my query (shown below) gets some records from a couple of tables in my database using INNER JOINS and the WHERE clause to specify the required constraints. However, I also want to read two fields from a *single* record from a table called 'Locations' and then apply one of these field's values...
2
3047
by: google | last post by:
Hello everyone, I am having an issue using the "Multi Select" option in a list box in MS Access 2003. I am making a form that users can fill out to add an issue to the database. Each issue can be associated with multiple categories. I have an "Issue," "IssueCategory," and "Category" in the database (among other tables). The form has a subform in it which is tied to the "IssueCategory" table. The main form is tied to the "Issue"...
4
1338
by: bill salkin | last post by:
The code below creates a dataset containing a table called "Customers" from the Northwind database Later on in my code, after the database connection is closed, I need to access this dataset to get all records with "ContactTitle" = 'Owner' and "City" = 'London'. I have tried using the SELECT and Find methods of dataset techbnology but I can't make them work with multi- criteria queries.Help!
4
6851
by: Lucky | last post by:
hi guys! Currently i'm facing a bit odd situation. i cant modify my code so i have to make changes in SQL Server. the problem is, i've modified one table by adding new column and now i want only those row which has not null value in that column whenever the select statement gets fire. i mean in every select statement only those rows should be returned which has NOT NULL value in the newly added column.
1
5347
by: Jenny | last post by:
Dear all, I have one select which lists one visible element. I want this select can show scrollbar after I click its down arrow, so that i can use the scrollbar to select the element i want. I test it on windows IE. The scrollbar will be shown when the select has more than 30 elements, otherwise it won't show scrollbar. I don't want the list to be that long. I hope that the scrollbar can be shown when the number of elements is 8.
7
2940
by: php_mysql_beginer911 | last post by:
Hi .. hope someone will help i am trying to figure it out why i cannot post string "union select" every time i try to post data which content union and select .. the page doesn't get posted and it shows error page not found on this server i googled and found some people use union and select to hack sites (mysql injection) i guess the server i am using has some kind of filter and if a post string content "union select" ... it simply...
0
9727
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10643
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
10330
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
9477
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...
0
7050
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5716
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
5907
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
4113
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
3158
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

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.