Welcome to the MacNN Forums.

MacAtak · May 31, 2005, 12:15 PM

This is really bugging me, because I've read a bunch of forums that say this should work.

I'm generating a fieldset of checkboxes on the fly using the JavaScript DOM. This all works fine and dandy. I append this fieldset to a td element which is a child of the form I'm trying to submit, but when I do this it doesn't add the the inputs to the form so they don't get submitted. If I add the fieldset directly to the form node it adds the input fields to the form but then you can't see the fieldset.

Anybody have a clue of what I could be doing wrong?

Code:
<script type="text/javascript">
function addTo() {
    // get selected info from available groups select box
    ...
    
    // create checkboxes
    var view = document.createElement('input');
    view.setAttribute('type', 'checkbox');
    ...

    // create fieldset
    var fieldset = document.createElement('fieldset');
    fieldset.appendChild(view);
    ...
    
    var form = document.forms['groups'];
    var current_groups = document.getElementById('current_groups'); // td element

    // form.appendChild(fieldset); // adds fieldset to form but you can't see it
    
    current_groups.appendChild(fieldset); // adds fieldset to table but doesn't get submitted
     
    // this is how I'm testing it. Adding directly to the form increases this value while
    // adding to the current_groups node does not.
    alert(document.forms['groups'].elements.length);
    
}
</script>
<body>
<form id="groups" method="post" aciton="">
<table>
<tr>
<td id="current_groups">
<!-- contains current groups -->
</td>
<td>
<! -- contains select box with available groups -->
</td>
</tr>
</table>
</form>
</body>

MacAtak · May 31, 2005, 02:18 PM

You've gotta be kidding me! I figured it out. I had my form set up like this:

Code:
<table>
<form>
...
</form
</table>

Which doesn't work, but this does...

Code:
<form>
<table>
...
</table>
</form>

Man, the little things will get you every time.

Peder Rice · Jun 1, 2005, 07:53 AM

For future reference, <table> tags are peculiar animals.

http://www.w3.org/TR/REC-html40/struct/tables.html

Just as an anchor tag can't have a <div> within itself, a <table> tag cannot have a <form> element within it (though I do believe most browsers won't mind).

Simon Mundy · Jun 1, 2005, 12:04 PM

Originally Posted by MacAtak

but this does...

Code:
<form>
<table>
...
</table>
</form>

Yep, if it doesn't validate, then good chances are your JavaScript will fail.