PHP generated form does not submit AJAX

Question

I have a select with ROWID in the value and the name in the value,

<select name="opcoes"  onchange="showInfo(this.value)">
<option value=''>Select</option>
<option value=6>A</option>
<option value=2>F</option>
<option value=5>L</option>
<option value=1>M</option>
</select>

when you select one i have this ajax code to create a form with php,

    function showInfo(str)
{


if (str=="")
  {

  document.getElementById("fields").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("fields").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","php/vendors/getRow.php?id="+str,true);
xmlhttp.send();
}

Next if the selected value isnt "" it goes to the php,

...conection to the database...

echo "<form action='/php/vendors/edit.php' onSubmit=\"return confirm('Deseja editar?')\" method='post' >"; 
echo "<td><input type='text' name='editname'   value='".utf8_encode($linha[vendor_name])."'    ></td>";
echo "<td><input type='text' name='editemail'    value='".utf8_encode($linha[vendor_email])."'    ></td>";
echo "<td><input type='text' name='editwebsite'    value='".utf8_encode($linha[vendor_website])."'  ></td>";
echo "<td><input type='text' name='editphone'    value='".utf8_encode($linha[vendor_phone])."'    ></td>";
echo "<td><input type='text' name='editfax'     value='".utf8_encode($linha[vendor_fax])."'     ></td>";
echo "<td><input type='text' name='editadress'    value='".utf8_encode($linha[vendor_adress])."'   ></td>";
echo "<td><input type='text' name='editincharge'   value='".utf8_encode($linha[vendor_incharge])."'  ></td>";
echo "<td class='btn'><input class='edit' type='submit' value=''></td>";
echo "</form>";

It displays every information correctly the ONLY problem is that it does not submit when i click the input submit button... any ideas why?

Is the function defined before or after the HTML elements? If before, you should wrap it inside a window.onload and assign the onclick from there — Niccolò Campolungo
– Niccolò Campolungo, Commented Jul 16, 2013 at 9:16
i link the script in the head of the html... i didnt understand what you meant... it is called after the page loads and the user selects an option — André Alvarez
– André Alvarez, Commented Jul 16, 2013 at 9:18

Quentin · Accepted Answer · 2013-07-16 09:31:17Z

2

You are generating invalid HTML.

A form can contain an entire table. A table cell can contain an entire row. A form cannot exist inside a table but around a set of cells in that table.

Your browser is error recovering by moving the form to after the table but leaving the form controls behind.

This means that the submit button isn't inside a form so it can't submit a form.

answered Jul 16, 2013 at 9:31

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

RONE Over a year ago

@André Alvarez As Quentin said, you have error in building form, first correct your html then try again

André Alvarez Over a year ago

But this bit of code is inserted inside a <table> with a div if you check the ajax code "fields" in the html there is a <tr id="fields">

Quentin Over a year ago

@AndréAlvarez — That's my point. <tr><form><td></td></form></tr> is invalid and will not work.

André Alvarez Over a year ago

So it should be? <form><tr><td></td></tr></form>

Quentin Over a year ago

No! Read the answer! You have to put the form around the entire table or entirely inside a single cell.

|

Jan Peter · Accepted Answer · 2013-07-16 09:26:06Z

0

If you load dynamically HTML forms in your document, they aren't registered in the DOM. Try to get this work with jQuery delegates jQuery Delegates

answered Jul 16, 2013 at 9:26

Jan Peter

9307 silver badges19 bronze badges

3 Comments

Quentin Over a year ago

They are registered in the DOM, just not when the page is loaded … but since the event handlers are not bound at page load time, that doesn't matter.

steven Over a year ago

i think quentin is right. But using jquery is allways a good idea because he is able to replace the ugly selfmade xmlhttprequest with jquerys $.ajax...

Quentin Over a year ago

You can have neater XHR code without resorting to the overhead of jQuery.

Collectives™ on Stack Overflow

PHP generated form does not submit AJAX

2 Answers 2

6 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related