JavaScript Toggle Checkbox State
Moderator: General Moderators
-
Charles256
- DevNet Resident
- Posts: 1375
- Joined: Fri Sep 16, 2005 9:06 pm
This function toggles all checkboxes in a named form.
Well, I'm no javascxript guru, but I wrote this JS function to toggle all boxes in a named form. I wanted something more generic. This works for any form, not a specific named form. Call it with two arguments - the name of the form ("myform_name") and assign true or false to the argument "checked". All checkboxes will be set to the value of "checked";
As I've said, I'm no JS expert - I've been writing software for 30 years, but only have been doing this for a couple of years, so if there are any bugs or clinkers in this I'd appreciate feedback.
As I've said, I'm no JS expert - I've been writing software for 30 years, but only have been doing this for a couple of years, so if there are any bugs or clinkers in this I'd appreciate feedback.
Code: Select all
function CheckAll(myform_name,checked) {
var i;
var len;
len = document.forms[myform_name].elements.length;
for (i=0; i < len; i++) {
if (document.forms[myform_name].elements[i].type == "checkbox" && document.forms[myform_name].elements[i].disabled == false ) {
document.forms[myform_name].elements[i].checked=checked;
}
}
}- n00b Saibot
- DevNet Resident
- Posts: 1452
- Joined: Fri Dec 24, 2004 2:59 am
- Location: Lucknow, UP, India
- Contact:
jayshields wrote:Is it known that IE puts line breaks in after </form> and FF doesn't? I think that's the provlem I'm having now. Any way to solve it?
Code: Select all
FORM { margin:0px; padding:0px; }- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
- n00b Saibot
- DevNet Resident
- Posts: 1452
- Joined: Fri Dec 24, 2004 2:59 am
- Location: Lucknow, UP, India
- Contact:
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
It didn't work, but upon re-reading my question, I mis-worded it a bit.
This is my PHP:
and my CSS:
and a screenshot of the current state:

You can see the bottom row (the grey one) on the screenie, I want all that content to be on the same line, preferably with Directories: x | Files: x left aligned and New Directory: <input> <submit> right aligned, but I'll tackle the alignment after I can simply get it on the same line.
Any ideas?
This is my PHP:
Code: Select all
//Show some stats
echo '<tr bgcolor="';
//Alternate the row bg colours
$i++;
if ($i % 2 == 0) {
echo '#F0F0F0';
} elseif ($i % 2 == 1) {
echo '#FFFFFF';
}
echo '"><td colspan="4"><font size="-1">Directories: ' . $dircount . ' | Files: ' . $filecount;
//Show the new dir form/input
echo '<form class="newdir" action="index.php?dir=' . $_GET['dir'] . '" method="post">';
echo 'New Directory: <input type="text" size="20" maxlength="30" name="dirname"> ';
echo '<input type="submit" name="makedir" value="Create"></form></font></td></tr>';Code: Select all
form.newdir {
margin: 0px;
padding: 0px;
}
You can see the bottom row (the grey one) on the screenie, I want all that content to be on the same line, preferably with Directories: x | Files: x left aligned and New Directory: <input> <submit> right aligned, but I'll tackle the alignment after I can simply get it on the same line.
Any ideas?
- n00b Saibot
- DevNet Resident
- Posts: 1452
- Joined: Fri Dec 24, 2004 2:59 am
- Location: Lucknow, UP, India
- Contact:
Code: Select all
echo '"><td colspan="2" align="left"><font size="-1">Directories: ' . $dircount . ' | Files: ' . $filecount;
//Show the new dir form/input
echo '</font></td><td colspan="2" align="right"><form class="newdir" action="index.php?dir=' . $_GET['dir'] . '" method="post">';
echo '<font size="-1">New Directory:</font> <input type="text" size="20" maxlength="30" name="dirname"> ';
echo '<input type="submit" name="makedir" value="Create"></form></td></tr>';- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
The very first thing I tried was 2 seperate columns with colspan of 2 each, but as you can see, the 2 left columns are much wider than the 2 right ones, the 2 on the right are so thin that my right aligned stuff wont fit.
I tried adding width="50%" onto both the colspan 2 columns but for some reason it didnt work, and the double columns stuck to the same widths.
That's why I resorted to one colspan 4 column, get stuff on the same line, then go about aligning it properly.
I'll have a dabble with seperate double columns again later but when I first tried it it didn't work...
Edit: Just looked back at my post. Thinking about what I said, if it came down to it, I could just make a new CSS class same as for the form but table.lastrow and then make a new table under it and put 2 columns in it 50% width each and do it like I was going to originaly. It would look like a row but infact be a seperate table, and it should work OK like that, even though it's a bit of a poor mans work-around.
Edit2: I'm about ready to cry now. I put it in a new table, I can get the formatting fine, but it leaves a massive gap inbetween the last row (the new seperate table), and the other table with the rest of the rows. I couldn't fix that, I tried applying some styles but gave up and went back to keeping it in one table.
Now I'm so close to getting it. If both the sets of info are in the same column, it wont stay on the same line no matter what, so I've had to split it to 2 columns, which I thought I might anyway. So now I want `dynamic` column widths. If I make both columns colspan 2, then it snaps to the same widths as the above columns. So if I set both columns to 50% width it brings them out a bit better, but totally wrecks my above column widths.
I've tried applying some CSS to the table and row, but nothing seems to make it work. table-layout: fixed and auto doesn't work, on the row or the table.
All I want is the bottom row to have 2 columns both 50% width, regardless of the other column widths. Surely to god this is possible.
Please help!
Edit: This is my current HTML:
I tried adding width="50%" onto both the colspan 2 columns but for some reason it didnt work, and the double columns stuck to the same widths.
That's why I resorted to one colspan 4 column, get stuff on the same line, then go about aligning it properly.
I'll have a dabble with seperate double columns again later but when I first tried it it didn't work...
Edit: Just looked back at my post. Thinking about what I said, if it came down to it, I could just make a new CSS class same as for the form but table.lastrow and then make a new table under it and put 2 columns in it 50% width each and do it like I was going to originaly. It would look like a row but infact be a seperate table, and it should work OK like that, even though it's a bit of a poor mans work-around.
Edit2: I'm about ready to cry now. I put it in a new table, I can get the formatting fine, but it leaves a massive gap inbetween the last row (the new seperate table), and the other table with the rest of the rows. I couldn't fix that, I tried applying some styles but gave up and went back to keeping it in one table.
Now I'm so close to getting it. If both the sets of info are in the same column, it wont stay on the same line no matter what, so I've had to split it to 2 columns, which I thought I might anyway. So now I want `dynamic` column widths. If I make both columns colspan 2, then it snaps to the same widths as the above columns. So if I set both columns to 50% width it brings them out a bit better, but totally wrecks my above column widths.
I've tried applying some CSS to the table and row, but nothing seems to make it work. table-layout: fixed and auto doesn't work, on the row or the table.
All I want is the bottom row to have 2 columns both 50% width, regardless of the other column widths. Surely to god this is possible.
Please help!
Edit: This is my current HTML:
Code: Select all
<tr bgcolor="#F0F0F0">
<td colspan="2" width="50%" align="left">
<font size="-1">Directories: 6 | Files: 4</font>
</td>
<td colspan="2" width="50%" align="right">
<font size="-1">
<form class="newdir" action="index.php?dir=uploads/collegestuff" method="post">
New Directory:
<input type="text" size="20" maxlength="30" name="dirname">
<input type="submit" name="makedir" value="Create">
</form>
</font>
</td>
</tr>- n00b Saibot
- DevNet Resident
- Posts: 1452
- Joined: Fri Dec 24, 2004 2:59 am
- Location: Lucknow, UP, India
- Contact:
completely forgot this
ok here is your solution
was elusive yet simple one 
ok here is your solution
Code: Select all
echo '"><td colspan="4"><font size="-1"><p style="float:left">Directories: ' . $dircount . ' | Files: ' . $filecount;
//Show the new dir form/input
echo '</p><form style="float:right" class="newdir" action="index.php?dir=' . $_GET['dir'] . '" method="post">';
echo 'New Directory: <input type="text" size="20" maxlength="30" name="dirname"> ';
echo '<input type="submit" name="makedir" value="Create"></form></font></td></tr>';- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England