I need four forms in this crazy table. I couldn't get them to work myself. The buttons have to be outside the table for layout purposes. This is what makes it so tricky. Each button is below it's table... I don't think it's possible to make it work with the current code. Any help would be appreciated. <table width="95%" border="0"><tr> <td> <table class="thinline" width="100%" align="center"><tbody><tr> <td> <table cellpadding="2" cellspacing="1" width="100%" align="center"> <tr> <td align="center" class="bgtopic" colspan="2">1</td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td colspan="2"> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> </table> </td></tr></tbody></table> </td> <td valign="top"> <table class="thinline" width="100%" align="center" border="0"><tbody><tr><td valign="top"> <table cellpadding="2" cellspacing="1" width="100%" align="center"> <tr class="topicRow1"> <td align="center" class="bgtopic" colspan="2">2</td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td align="center" colspan="2"><br><br> </td> </tr> <tr class="topicRow1"> <td align="center" colspan="2"> </td> </tr> <tr class="topicRow1"> <td align="center" colspan="2"> </td> </tr> <tr> </tr> </table> </td></tr></tbody></table> </td> </tr> <tr> <td align="center"><input type="submit" name="first3" value="UPDATE OPTIONS" /></td> <td align="center"><input type="submit" name="first3" value="UPDATE OPTIONS" /></td> </tr> <tr> <td align="center"> </td> <td align="center"> </td> </tr> <tr> <td valign="top"> <table class="thinline" width="100%" align="center"><tbody><tr> <td> <table cellpadding="2" cellspacing="1" width="100%" align="center"> <tr class="topicRow1"> <td align="center" class="bgtopic" colspan="2">3</td> </tr> <tr class="topicRow1"> <td height="69"> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> </table> </td></tbody></table> </td> <td valign="top"> <table class="thinline" width="100%" align="center"><tbody><tr> <td> <table cellpadding="2" cellspacing="1" width="100%" align="center"> <tr class="topicRow1"> <td align="center" class="bgtopic" colspan="2">4</td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1"> <td colspan="2"> </td> </tr> <tr class="topicRow1"> <td> </td> <td> </td> </tr> <tr class="topicRow1" id="delun_div" style="display: none"> <td align="left"> </td> <td align="left"> </td> </tr> <tr> <td align="center"> </td> <td align="center"> </td> </tr> <tr> </table> </td></tr></tbody></table> <div align="center"> <input type="submit" name="first2" value="UPDATE OPTIONS" /></div></td> </tr> <tr> <td align="center"><input type="submit" name="first3" value="UPDATE OPTIONS" /></td> <td align="center"> </td> </tr> <tr> <td align="center"> </td> <td align="center"> </td> </tr> <tr> <tr> <td> </td> <td> </td> </tr> </table> HTML: Here is how it looks: It took me hours to make that table. I need to have that many tables there because it gives a nice layout effect... So removing tables is not an option. Perhaps adding?
First I don't see any <form> tags. Your submit buttons are useless outside a form tag. If you wanted to create a button outside the form tags to submit, you'd need a bit of Javascript. You could do something like this. <form id="myform" name="myform" action=... ... </form> <input type="button" id="button" name="button" onClick="document.myform.submit()" />
That's why I posted this topic. I don't know where to put them without leaving the button outside the tags for it to properly work. I really would prefer not to use javascript there since it might not work for all of my users. Any ideas?
Your tables are poorly indented and very hard to read. I don't know what you are going to submit. There are no input tags. I'm trying to help but I can't get your code in a readable format in a reasonable amount of time. I'll give it a shot, but I'm still a little unclear. I don't know why the buttons have to go outside the table. Your form tags should go outside the four main table tags. Your submit button should go inside the form tags and inside the table. Make the last <td> of your table with a colspan="2" and put the button in there. That way it will be inside the table and still look right. <td align="center" colspan="2"><input type="submit" name="first3" value="UPDATE OPTIONS" /></td>
I can't make another row, the border is what's important. I deleted all the inputs to make it easier to read. Basically as the pic shows I need to pick all the data from each table with the forms, but I can't get the forms right....