JavaScript Toggle Checkbox State

JavaScript and client side scripting.

Moderator: General Moderators

Charles256
DevNet Resident
Posts: 1375
Joined: Fri Sep 16, 2005 9:06 pm

Post by Charles256 »

ah,sorry bout the misinformation on the java console..it's on the same line as my developer extension so I just assumed the two were together..my mistake :-D
tanstaafl
Forum Newbie
Posts: 1
Joined: Sun Nov 20, 2005 11:40 am
Location: Seattle

This function toggles all checkboxes in a named form.

Post by tanstaafl »

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.

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;
        }
    }
}
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

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; }
:wink:
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Post by jayshields »

Cool. I'll try that later. So it is a known "bug", and that is the proper workaround? Or I'm just being stupid and your helping me? Or both? :D

Cheers dudeski.
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

jayshields wrote:So it is a known "bug", and that is the proper workaround? Or I'm just being stupid and your helping me? Or both? :D
Both :lol:
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Post by jayshields »

It didn't work, but upon re-reading my question, I mis-worded it a bit.

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>';
and my CSS:

Code: Select all

form.newdir {
	margin: 0px;
	padding: 0px;
}
and a screenshot of the current state:
Image

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? :(
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

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>';
HIH ;)
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Post by jayshields »

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:

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>
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

completely forgot this :x

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>';
was elusive yet simple one :)
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Post by jayshields »

YES! IT WORKED! WAAHOOO0O0O0!

muchos love to you :)
Post Reply