Select All Checkbox Code?!

JMareel · 02-18-2007, 08:29 AM

Hello everyone. I am new to these forums and am also a newbie at coding.

After doing much research and scouring on the internet I have finally found the Selectall checkbox javascript code. I have been playing around with it to figure out what controls the script and define what checkboxes will be checked when the allbox checkbox is checked, but have not been able to figure it out. I need to modify the javascript code below to do a couple things.

1.) There are multiple tables each containing a title with checkbox and rows of choices with checkboxes next to each row. I would like to know how to modify the javascript so that if the user would like all the choices in Table1, they would click the checkbox next to Table1 title, thus checking all checkboxes in each row of Table1 only. Table2, Table3, etc. checkboxes would remain unchecked.

2.) Once all choices were checked in the order page and the SUBMIT button clicked, how would I show only the checked results in a separate confirmation page with the calculated price based on what choices were checked?

3.) In all my research on this topic I found out that spam spiders scour the internet looking at the source code and grab email addresses to collect. How can I beat these spam spiders and still have the results of the confirmation page sent to my email address? Or should I have the results saved as a file or other format for me to retrieve from my website?

Selectall Checkbox Code

Code:

<html>
<head>
<script language="javascript">
function checkAll(){
	for (var i=0;i<document.forms[0].elements.length;i++)
	{
		var e=document.forms[0].elements[i];
		if ((e.name != 'allbox') && (e.type=='checkbox'))
		{
			e.checked=document.forms[0].allbox.checked;
		}
	}
}
</script>
</head>

<body>
<form>
<input type="checkbox" value="on" name="allbox" onclick="checkAll();"/> Check all<br />

<h3>Fruit</h3>
<input type="checkbox" value="on" name="apples" /> Apples<br/>
<input type="checkbox" value="on" name="oranges" /> Oranges<br/>
<input type="checkbox" value="on" name="bananas" /> Bananas<br/>

</form>
</body>
</html>

Thanks in Advance,
JM

redhead · 02-18-2007, 09:15 AM

1) Either surround the different tables with their seperate <form></form>, and change the javascript to something like:

Code:

function checkAll(table){
	for (var i=0;i<document.forms[table].elements.length;i++)
	{
		var e=document.forms[table].elements[i];
		if ((e.name != 'allbox') && (e.type=='checkbox'))
		{
			e.checked=document.forms[table].allbox.checked;
		}
	}
}

And in your allCheck box, call it with something accordingly like

Code:

...
<input type="checkbox" value="on" name="allbox" onclick="checkAll(0);"/>
...
<input type="checkbox" value="on" name="allbox" onclick="checkAll(1);"/>
...

Or name the checkboxes something which makes sence, like:

Code:

...
<input type=checkbox name=table1_1>
<input type=checkbox name=table1_2>
...
<input type=checkbox name=table2_1>
<input type=checkbox name=table2_2>
...

And modify the javascript code to something like:

Code:

function checkAll(table){
	for (var i=0;i<document.forms[0].elements.length;i++)
	{
		var e=document.forms[0].elements[i];
		if ((e.name.substring(0,table.length) == table) && (e.name != 'allbox') && (e.type=='checkbox'))
		{
			e.checked=document.forms[0].allbox.checked;
		}
	}
}

And then according to the table number, call it like:

Code:

<input type="checkbox" value="on" name="allbox" onclick="checkAll("table1");"/>

2) and 3) requires some server side scripting like PHP/MySQL solutions....

JMareel · 02-18-2007, 01:07 PM

redhead,
First of all thank you for replying with quickness because this is the only problem holding me back from posting my website to the 'net.

If I go with your 2nd option of naming the checkboxes (table1_1, table1_2, etc.), changing the code to call function checkAll(table){, and changing the allbox to onclick="checkAll("table1");", do I have to have a function checkall for each physical table on the page AND in the source code only change the table# after checkAll to the appropriate number.

Basic outline of the source code would look like this.
**Source Code**

<form
function checkAll(table1){
table1
<input type="checkbox" value="on" name="allbox" onclick="checkAll("table1");"/>

function checkAll(table2){
table2
<input type="checkbox" value="on" name="allbox" onclick="checkAll("table2");"/>
.
.
</form>

OR would it look like this?

<form
function checkAll(table){
table1
<input type="checkbox" value="on" name="allbox" onclick="checkAll("table1");"/>

table2
<input type="checkbox" value="on" name="allbox" onclick="checkAll("table2");"/>
.
.
</form>

I don't know if there is only one function checkAll or there needs to be one function for each table.

Thanks again for your time,
JM

redhead · 02-18-2007, 01:55 PM

If you either decide solution 1 or 2 there will only be one checkAll function, I would most likely prefere the second solution, sicne you only need one single <form></form> surrounding all tabels within the page, and that would make it more vertile to query some form of server-side result processing..

So the layout would be something like this:

Code:

<script language...>
...
</script>
...
<form name=blah action=blah method=post>
<table ..>
<!-- first table -->
...
<input type=checkbox name=table1_apples>
<input type=checkbox name=table1_orranges>
...
<input type=checkbox name=allbox onclick="checkAll("table1");" value=on>
...
</table>
...
<table ..>
<!-- second table -->
...
<input type=checkbox name=table2_apples>
<input type=checkbox name=table2_orranges>
...
<input type=checkbox name=allbox onclick="checkAll("table2");" value=on>
...
</table>
...
<input type=submit value="My submit button">
</form>
...

JMareel · 02-18-2007, 05:32 PM

redhead,

OK I believe I understand what you are saying about placement of code and implementation. I will go ahead and try it right now and hopefully my understanding is equal to your knowledge

. If I am able to get the first problem out of the way, then the #2 problem - Confirmation page, and the #3 problem - Results via email should be directed towards the PHP / SQL forum?

I will let you know if all goes well with this first part.

Thanks,
JM

JMareel · 02-18-2007, 06:37 PM

OK what am I doing wrong?

This is the code I have between head.

Code:

<head>
<script language="javascript">
function checkAll(table){
	for (var i=0;i<document.forms[0].elements.length;i++)
	{
		var e=document.forms[0].elements[i];
		if ((e.name.substring(0,table.length) == table) && (e.name != 'allbox') && (e.type=='checkbox'))
		{
			e.checked=document.forms[0].allbox.checked;
		}
	}
}
</script>

This is the code I have for the allbox

Code:

<input type="checkbox" value="on" name="allbox" onclick="checkAll("table1");"/>

And this is the code for the regular checkbox(es)

Code:

<input type="checkbox" name="table2_Bacteria" value="Bacteria"></td>

Where exactly do I put the function code. Maybe I am placing the javascript function code in the wrong place. Could you please give specific instructions as I fear my assumptions are the problem.

Thanks,
JM

redhead · 02-19-2007, 06:44 AM

Here is a small test which shows it:

Code:

<html>
<head>
<script language="javascript">
function checkAll(table){
	for (var i=0;i<document.forms[0].elements.length;i++)
	{
		var e=document.forms[0].elements[i];
		if ((e.name.substring(0,table.length) == table) &&
			(e.name.indexOf('allbox') < 0) && (e.type=='checkbox'))
		{
			e.checked=eval("document.forms[0]."+table+"_allbox.checked");
		}
	}
}
</script>
</head>

<body>
<form>
<table border="1">
<tr>
<td>
<input type="checkbox" value="on" name="table1_allbox" onclick="checkAll('table1');"/> Check 

all<br />

<h3>Fruit</h3>
<input type="checkbox" value="on" name="table1_apples" /> Apples<br/>
<input type="checkbox" value="on" name="table1_oranges" /> Oranges<br/>
<input type="checkbox" value="on" name="table1_bananas" /> Bananas<br/>
</td>
</tr>
<tr>
<td>
<input type="checkbox" value="on" name="table2_allbox" onclick="checkAll('table2');"/> Check 

all<br />

<h3>Fruit</h3>
<input type="checkbox" value="on" name="table2_apples" /> Apples<br/>
<input type="checkbox" value="on" name="table2_oranges" /> Oranges<br/>
<input type="checkbox" value="on" name="table2_bananas" /> Bananas<br/>
</td>
</tr>
</table>
</form>
</body>
</html>

as you can see, I had to make a small change to the lookout for the "allbox" check, since at this point there are several allboxes...

JMareel · 02-19-2007, 09:18 AM

As Jim Carey once said in I can't remember what movie...

"You love me! You really, really LOVE ME!"

Well problem #1 of my original post at the top is completed thanks to you!
I will definitely give you credit once I am able to post my site to the web

Now I see in your profile and website that you know some PHP and SQL =\. Is that true? If you do, do you know enough and be willing to help me out answer my #2 and #3 problem in my original post which you said requires PHP and SQL?

100 Thanks,
JM

redhead · 02-19-2007, 01:08 PM

The truth is, as stated in the Introduction thread, I hold a PhD in Comp. Sci. with a master in Math, so naturaly I know quite a few programming languages. The ones mentioned in my profile, are then ones I use freequently professionaly, so yes I do know PHP and SQL.

And I'd be willing to help you out with solving the rest of your troubles with this thing.

I must say, php.net is a very usefull resource, when it comes to PHP related items. And SQL isn't that difficult to understand, its a language written to conform with the normal request one might ask, like "I want everything which conforms to the state, that x=y and z=n", It's simply put "SELECT * FROM table WHERE x=y AND z=n".

Altho the SQL-syntax would be of some use, if you'd never seen the language befor.

JMareel · 02-20-2007, 04:28 AM

First of all thanks again for all the help. I've been busting my rear trying to research, study, and understand whatever code language I need to do the various functions on my website I'm creating. Secondly, I hope you didn't take offense to the "... is it true?" statement concerning your knowledge.

I will continue research and study of PHP and SQL to resolve my #2 and #3 issue of original post at the top because I like to understand the working of the code itself behind the feature.

I don't want to burden you with all the coding work. Would you prefer I found the code to accomplish #2 and #3 and post here in this topic for your to manipulate according to my needs? Again many thanks to you because you made me feel as though I am making progress in my drive to finish my website.

Thanks,
JM

redhead · 02-20-2007, 01:21 PM

Quote:

I hope you didn't take offense

None taken.

Quote:

I don't want to burden you with all the coding work. Would you prefer I found the code to accomplish #2 and #3 and post here in this topic for your to manipulate according to my needs?

First of, I have no idear what it is you're trying to do, and what need you might have.. Since you never described your orriginal design.

If you could open a new thread in the PHP section describing what you want to do, and what you've found out so far, then I (and perhaps Mike et al.) will follow you through the learning process of achieving it through PHP/SQL.

Quote:

Again many thanks to you because you made me feel as though I am making progress in my drive to finish my website.

It's allways a pleasure to see positive feedback, most people respond with a simple "I got it working"
Oh and one thing I forgot from teh beginning, welcome here at Code Newbie, I hope you like our community so far

JMareel · 02-21-2007, 02:35 PM

First of all thanks and I feel very welcome here. I've tried other forums, (namely microsoft frontpage) and didn't get anywhere near a response or help as what I received here within hours. Also I always give credit where credit is due so of course.

Well then let me make this post the last of this thread and move over to the PHP forum to resolve the now famous #2 and #3 problem. See you in PHP forum.

Talk To You Soon,
JM