CodeIgniter Forums

Full Version: Posting jquery cloned form fields.
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I am working on a project for a client who asked that I add a feature to a form allowing him to add (dynamically) extra fields for multiple phone numbers and/or email addresses. So I simply set up a jquery script to clone the fields on clicking a button. However, when I submit the form only the data in the original field is submitted, the cloned fields are not recognized or are being filtered, because they are not included at all in $_POST. I thought that XSS was the culprit, but it is globally set to false. What am I overlooking. The form is not public facing and is locked behind authentication so XSS is not a concern.
I would guess it's the naming of your form inputs. You need to make sure that the form fields are named as an array. Something like:

Code:
<input type="text" name="my_field[]">
    <input type="text" name="my_field[]">

That should come to your PHP script as an array that you can process as needed.
(08-09-2015, 08:16 PM)kilishan Wrote: [ -> ]I would guess it's the naming of your form inputs. You need to make sure that the form fields are named as an array. Something like:


Code:
   <input type="text" name="my_field[]">
   <input type="text" name="my_field[]">

That should come to your PHP script as an array that you can process as needed.

Actually I don't want the data to end up in an array or to have to serialize the data to put in the database, so I have the jquery script incrementing an index and appending it to the end of the name.  So it is like "my_field1" "myfield2" etc.  Then I have the actual columns in the database, and limit the number of duplicate fields to the number of columns.

Anyway I finally tracked down my problem.  I created a simplified version of the form with just the field being duplicated present, and all the cloned fields posted just fine.  So then going back through my orginal form, I found a stray </div> tag.  It was not causing any visual problems, because Firefox is so forgiving of html markup errors I guess, but apparently it was affecting the cloned fields presence in the DOM.
(08-09-2015, 07:58 PM)skribe Wrote: [ -> ]I am working on a project for a client who asked that I add a feature to a form allowing him to add (dynamically) extra fields for multiple phone numbers and/or email addresses.  So I simply set up a jquery script to clone the fields on clicking a button.  However, when I submit the form only the data in the original field is submitted, the cloned fields are not recognized or are being filtered, because they are not included at all in $_POST.  I thought that XSS was the culprit, but it is globally set to false.  What am I overlooking.  The form is not public facing and is locked behind authentication so XSS is not a concern.

1) make sure your new input elements is within the FORM tag
2) make sure your new input element's name attribute is unique
Thanks Tony. As I mentioned in my post right above yours, I did find the problem. My form is quite long, and there was a stray closeing </div> tag in the middle of the form. As soon as I remove it, everything posted just fine. Why exactly that could cause the problem I am still unsure.