Form Issue (closing itself early in table)

Question

I'm running a query via php on a mysql database. With my result set I'm am iterating the following table:

        $resultString = '<table>';
        $resultString .= '<tr>';
        $resultString .= '<th>Index</th>';
        $resultString .= '<th>Title</th>';
        $resultString .= '<th>File</th>';
        $resultString .= '<th>Template File</th>';
        $resultString .= '<th>Pretty URL</th>';
        $resultString .= '<th>Parent</th>';
        $resultString .= '<th></th>';
        $resultString .= '</tr>';

        while($data = mysql_fetch_assoc($results)){
            $resultString .= '<form class="myForm">' ."\n";

            $resultString .= '<tr>' ."\n";

            $resultString .= '<input type="hidden" name="index" value="' . $data['index'] . '">' ."\n";
            $resultString .= '<input type="hidden" name="title" value="' . $data['title'] . '">' ."\n";
            $resultString .= '<input type="hidden" name="file_name" value="' . $data['file_name'] . '">' ."\n";
            $resultString .= '<input type="hidden" name="template_file" value="' . $data['template_file'] . '">' ."\n";
            $resultString .= '<input type="hidden" name="child_of" value="' . $data['child_of'] . '">' ."\n";
            $resultString .= '<input type="hidden" name="pretty_url" value="' . $data['pretty_url'] . '">' ."\n";

            $resultString .= '<td class="indexTd">' . $data['index'] . '</td>' ."\n";
            $resultString .= '<td>' . $data['title'] . '</td>' ."\n";
            $resultString .= '<td>' . $data['file_name'] . '</td>' ."\n";
            $resultString .= '<td>' . $data['template_file'] . '</td>' ."\n";
            $resultString .= '<td>' . $data['pretty_url'] . '</td>' ."\n";
            $resultString .= '<td>' . $this->get_parent_select_list($data['child_of'],$data['index']) . '</td>' ."\n";
            $resultString .= '<td class="buttonTd"><input type="button" class="deletePageButton" value="X" onclick="submit_form(this,\'deletePage\')"></td>' ."\n";

            $resultString .= '</tr>' ."\n";

            $resultString .= '</form>' ."\n";
        }

        $resultString .= '</table>';

The table comes out great, the only problem is my form isn't working at all... viewing it in FireBug I see this:

alt text

The form is closing itself becore all of my input tags can populate it. I HAVE tried putting the tags inside a "<td>" instead of a "<tr>" to no avail....

thoughts?

also with self closing tags such as input types `text|password` they must end with `/>` so the dom knows that it should not expect a closing `` :) — RobertPitt, Sep 10 '10 at 20:32

Johan · Accepted Answer · 2019-03-10T11:35:58.557

12

When you open a tag within another tag, the tag you open will get closed when its parent gets closed. So this:

<p><form></p>
<p></form></p>

Will (or should) result in:

<p><form></form></p>
<p></p>

You should open your form above the table and close it at the bottom, thus enclosing the entire table in the form.

Placing non-table tags between tr,td,thead,tbody,tfoot or th tags is bad practice and not w3c compliant

edited Mar 10 '19 at 11:35

answered Sep 10 '10 at 18:39

Johan

1,958
11
20

Btw: It looks like you could do with your complete form in a single td. You have a lot of hidden fields and a single select box. I'd put everything in the td containing the select box. Good luck! – Johan Sep 10 '10 at 18:46
Thanks Johan. The real issue was matching up the delete button with the form. I have a jquery selector looking for the parent of the clicked element (in a function called submit_form) and then returning my form values from there. The select element can fire it's own event. Anyway, I stuck my form and all the hidden fields in the same td and we're up and running. Thanks again ;) – Howard Zoopaloopa Sep 10 '10 at 18:59
I didn't get it how this answer works?? Can you please explain coz i am totally stuck on this.My requirement is same as mentioned in the question. – Navin Bista Feb 11 '16 at 08:26
A HTML tag cannot break out of it's parent tag. So this:
is impossible. So a tag *must* be closed before its parent tag is closed. – Johan Feb 11 '16 at 14:54

score 0 · Answer 2 · answered Sep 10 '10 at 20:28

0

You'll need to put the form inside a TD.

I would also recommend using a template to generate the HTML, but that's beyond the scope of this question.

answered Sep 10 '10 at 20:28

Michał Tatarynowicz

1,294
2
15
33

score -1 · Answer 3 · answered Sep 10 '10 at 18:34

-1

egads! you should never nest html elements like that! forms should go inside a <td> or outside the whole table. and you shouldn't put hidden form elements inside a <tr>! they should go in a <td>.

answered Sep 10 '10 at 18:34

Patricia

7,752
4
37
70

ok, sounds great. But what would the solution be for this particular case? I need each row to be it's own form. Should I be nesting another table inside each td that is surrounded by the form? – Howard Zoopaloopa Sep 10 '10 at 18:37

Form Issue (closing itself early in table)

3 Answers3

Linked