www.webdeveloper.com
Results 1 to 6 of 6

Thread: Prototype: <form> inside a <table> doesn't work

  1. #1
    Join Date
    Feb 2009
    Posts
    17

    Prototype: <form> inside a <table> doesn't work

    I have been trying Ajax.Request for a form which exists as such:

    </tr><form><tr><td></td></tr></form><form><tr> and so on....

    I have just discovered that Prototype doesn't support a form interleaved in a table.

    The forms must exist outside the table as such:
    <form><table><tr>.....</table></form>

    ..for it to submit the form successfully.

    Is there a way around it such that I can use Ajax.Request with the form interleaved in a table?

    Thanks in advance!

  2. #2
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773
    EDIT: Just finished reading the rest of your post, and the answer is no. You need proper HTML before the browser will properly create the document object model. Sounds like your HTML needs to be rearranged a little.

  3. #3
    Join Date
    Feb 2009
    Posts
    17
    Right. I have a table and I would like each row to have a form. I cannot have a table within each row since I would like all the column to be same width. I cannot have fixed width either due to the nature of data.

    What possibly can I do?

  4. #4
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773

  5. #5
    Join Date
    Feb 2009
    Posts
    17
    Quote Originally Posted by toicontien View Post
    You'll need to split your table into multiple tables:
    HTML Code:
    <form>
      <table> ... </table>
    </form>
    <form>
      <table> ... </table>
    </form>
    You can resolve any styling issues that arise by using CSS.
    CSS...

    Using CSS, how can I make sure all the TDs (of the various independent tables) in a column are consistently of equal width, yet without having fixed-width?

    I am sorry, if it's obvious to you... but if such technique does exist, it will be pretty new to me.

    Thanks!

  6. #6
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773
    You can't. You'll need to use fixed widths, but that really isn't a huge deal. I'll assume a few things, but this code should at least give you the general idea:
    HTML Code:
    <form class="equalTables">
      <table>
        <tr>
          <td class="label"></td>
          <td><!-- form field --></td>
        </tr>
      </table>
    </form>
    
    <form class="equalTables">
      <table>
        <tr>
          <td class="label"></td>
          <td><!-- form field --></td>
        </tr>
      </table>
    </form>
    And the CSS:
    Code:
    .equalTables td.label {
      width: 100px;
    }
    The width you'll have to play around with to see what works best for this page. You miiiiiiight be able to give each FORM and form field an Id and then use the document.getElementById() function to access those tags, but I'm not sure. The easiest way in the long run is to start with valid markup, so I suggest the CSS method.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles