I'm using jQuery to add a form element. It appears on the page fine, with the correct value, but when I submit the form, the data doesn't show up on the PHP backend. I looked at Firebug's POST data and I don't see it in there either. The javascript I'm using to add the form element is:

$("#projectArray").append("<input type='text' name='data[Project][description]' value='"+projectDescription+"' id='test' />");

Has anyone run across anything like this? I've seem other posts but they seem to be typos and from what I can tell, I don't have any typos in this line.

Edit: As requested, here is the form code. I cut a lot of it out, as it is a pretty large form. If anyone wants the complete code, I can paste it.

<form action="/learningexperiences/add" id="LearningexperienceAddForm" method="post" accept-charset="utf-8">
    <div style="display:none;"><input type="hidden" name="_method" value="POST"/></div>
    <div class="input text"><tr><td><label for="LearningexperienceSubjectarea">Subject Area</label>&nbsp;&nbsp;</td><td><input name="data[Learningexperience][subjectarea]" maxlength="50" type="text" id="LearningexperienceSubjectarea"/></td></tr>
...
    <tr><td>Active</td><td><div class="cbx"><input type="hidden" name="data[Learningexperience][active]" id="LearningexperienceActive_" value="0"/><input type="checkbox" name="data[Learningexperience][active]"  checked="checked" value="1" id="LearningexperienceActive"/></div></td></tr>

    <tr><td colspan="2" style="vertical-align:middle;"><div id="projectArray"></div></td></tr>

...
    <input type="hidden" name="data[Learningexperience][id]" id="LearningexperienceId"/><tr><td colspan="2" style="vertical-align:middle;">&nbsp;</td></tr>

</table>

<table id="buttonsTable">
<tr><td style="text-align:right;"><div style="margin-right:5px;"><div class="submit"><input  name="cancel" type="submit" value="Cancel"/></div></div></td>
<td><div class="submit"><input  type="submit" value="Save Record"/></div></form></td></tr>
</table>

Edit 2: I changed my append tag to append to the form element (#LearningexperienceAddForm). I don't know why, but it started working at that point.

• php
• javascript
• jquery

I changed my append tag to append to the form element (#LearningexperienceAddForm). I don't know why, but it started working at that point.

came across this while having the same trouble. i'm pretty sure that you need your tags to be on the outside of everything.

something like this:

<form>
<table>

[add as many dynamic fields as you want]

</table>
</form>

for reasons that are way above my pay grade, if those tags are out of order the dynamic fields are not picked up for POSTing...

hope this saves somebody the 2 hours it cost me :-)

Instead of appending the HTML itself, I'm going to recommend creating the element and then appending it:

var input = document.createElement('input');
input.name = 'data[Project][description]';
input.type = 'text';
input.value = projectDescription;
input.id = 'test';
$('#projectArray').append(input);

This will do a better job of inserting it into the DOM for access.

Let me know if this works out for you.

For anyone who has had this issue just make sure that your closing form tag encloses the appended data. I had one too many closing divs in my form which Google Chrome replaced in as a closing tag, so watch out for this.

Kindly check all html element tags I mean opening(<...>) and closing tag() between the form. All should me in managed way.