PHP form produced by ajax not working

Question

I have a page that displays a table and in each table row a form is to be embedded which submits some data from a dropdown menu. I'm producing the page using AJAX. Below is what I'm echoing in the php page.

echo "<table id=\"comp\">";
echo "<tr> 
<th> CID </th>
<th> USERNAME </th>
<th> NAME </th>
<th> DESCRIPTION </th>
<th> ADDRESS </th>
<th> PHONE </th>
<th> DATE </th>
<th>Choose JE</th>
<th></th>
</tr>";
for($i=0;$i<$count;$i++)
{
   $c = mysql_result($result, $i, 'cid');
echo "<form name=\"$i\" action=\"je_select.php\" method=\"post\">
<tr id=\"$i\">";
echo "<td>".$c."</td>";
echo "<td>".mysql_result($result, $i, 'uname')."</td>";
echo "<td>".mysql_result($result, $i, 'name')."</td>";
echo "<td>".mysql_result($result, $i, 'desc')."</td>";
echo "<td>".mysql_result($result, $i, 'address')."</td>";
echo "<td>".mysql_result($result, $i, 'phone')."</td>";
echo "<td>".mysql_result($result, $i, 'date')."</td>";

echo "<td>$dropdown</td>";
echo "<td><input type=\"hidden\" name=\"cid\" value=\"$c\"/><input type=\"submit\" value=\"Forward\"/></td>";
    echo "</tr></form>";
}       
echo "</table>";

Now the Problem is that the form displays fine but on clicking the Submit Button the form doesn't get submitted. It simply does nothing. While a similar code on another of my project works just fine.

Please Help me out with this. I'm stuck and I need to complete this project quickly.

EDIT

I tried opening the source code for this. And what I see is that the form tag is closing at the same place it was opened:

<form name=\"$i\" action=\"je_select.php\" method=\"post\"></form>

Why is this happening??. I also saw the post: Form Issue (closing itself early in table)

and I opened the form tag before the "tr" tag but it still is not working.

MORE

One more thing that I noticed is that in the AJAX page's source code the table also has a tbody tag for unexplained reasons. Though the tbody tag is also present in one of my older projects, but a similar thing works there. Please Help me.

AJAX functioning

The links to be clicked:

    <div id="choices">
        <ul id="clist">
            <a href="#" onclick="ajax(1);"><li>Pending Complaints</li></a>
            <a href="#" onclick="ajax(2);" ><li>Handled Complaints</li></a>
            <a href="logout.php" ><li>Logout</li></a>
            <div class="clear"></div>
        </ul>
    </div>

The function ajax:

        function ajax(val) {
        var xmlhttp;
        if (active != val) {
        active = val;
        if (window.XMLHttpRequest)
        {
            xmlhttp=new XMLHttpRequest();
        }
        else
        { 
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

        if (xhr) {
            xhr.abort();
        }
        xhr = xmlhttp;
        xmlhttp.onreadystatechange=function()
        {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {

            document.getElementById("content").innerHTML=xmlhttp.responseText;
            document.getElementById("banner").innerHTML=arr[val - 1];
        }
        }
            xmlhttp.open("GET","dispcae.php?&s="+val , true);
        xmlhttp.send(); 
    }
}

Have you tried stripping the form out of the Ajax and testing it on it's own? Some basic problem solving attempts wouldn't go a miss here... — naththedeveloper, Aug 29 '13 at 07:10
@FDL: Ya tried that and it works there. Infact, what I'm actually doing is when user opens the page, he sees this table by default. But if he chooses other menu items, those are opened using ajax, including this table. — tapananand, Aug 29 '13 at 07:13
You are echoing multiple forms because it is contained inside the loop — Voonic, Aug 29 '13 at 07:24
@shadow: Yes, but all have different names and as I said, A similar thing works on my other project and also in non-ajax produced pages for this very project. — tapananand, Aug 29 '13 at 07:25
you are not supposed to start form names with numbers that's not a good practice — Voonic, Aug 29 '13 at 07:26
can you post the code how you are adding this html output to your document via ajax — Voonic, Aug 29 '13 at 07:32
Form tag is not closed anywhere, can you post the result of Ajax call `responseText` ? — GoodSp33d, Aug 29 '13 at 07:55
@2-Stroker: The form tag is closed: echo ""; as can be seen in the code I posted — tapananand, Aug 29 '13 at 08:03

score 1 · Accepted Answer · edited May 23 '17 at 10:27

1

Ajax response is not a valid HTML. Form cannot be wrapped inside a table/tr/td/th.

Try restructuring the HTML, and use Form to wrap around the table.

Check out this similar Q&A

edited May 23 '17 at 10:27

Community

1
1

answered Aug 29 '13 at 08:54

GoodSp33d

6,252
4
35
67

score 0 · Answer 2 · answered Aug 29 '13 at 07:56

0

My guess data coming from your database is having quotes (Single or double) which breaks rendering in browser and your is closed without actually inside it and as there is no submit button inside form it will not do anything.

Put dummy data in database without any quotes and check

answered Aug 29 '13 at 07:56

Jack Daniel's

2,583
22
28

No the data doesn't have any quotes and plus it's working with the same data without ajax – tapananand Aug 29 '13 at 07:59
Post the rendered html from
beginning to
end tag
– Jack Daniel's Aug 29 '13 at 08:03
in the rendered html the form tag is getting close immediately:
– tapananand Aug 29 '13 at 08:24
@TapanAnand Can you put a dummy text instead of input elements and see if you are getting that dummy text within form tag – GoodSp33d Aug 29 '13 at 08:37
It is getting closed immediately because its not a valid HTML. – Jack Daniel's Aug 29 '13 at 08:39

PHP form produced by ajax not working

2 Answers2