Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I would use jQuery to add additional form elements. You'll need to give each element a different 'name' attribute though- I'd use something like name='user1name' (and in the next username field name='user2name'). Comment on my post if you need specific help with that. When the form submits, I'd use php to loop through each set of fields with an insert statement at the end of the loop.</p> <p><strong>PHP is something like this:</strong></p> <pre><code>for ($i = 1; is_null($_POST['name' . $i]) == false; $i++) { $name = $_POST['user' . $i . 'name']; // repeat for all your fields // do your insert statement here - 1 insert per user created mysql_query("INSERT INTO table_name (Name, Address, ...) VALUES ('$name', '$address', ...)"); } </code></pre> <p><strong>jQuery is something like this:</strong></p> <p>Existing HTML Should only have 1 div with class=user at this point</p> <pre><code>&lt;div id='fields'&gt; &lt;div class='user'&gt; &lt;input type='text' name='user1name' /&gt; &lt;input type='text' name='user2name' /&gt; ... more elements ... &lt;/div&gt; &lt;/div&gt; </code></pre> <p>jQuery</p> <pre><code>var userFields = $("div.user").clone(); $(userFields).appendTo("div#fields"); $("div#fields").children("div.user:last").children().each(function() { // change names here! }); </code></pre> <p>This will copy the existing field and add its copy to the fields div. It will also set the new names for the second set of user fields. Note: you only need ot set userFields once, and then you can use <code>$(userFields).appendTo("div#fields");</code> as many times as you need to (as long as the userFields variable is in scope).</p> <p>If you have event handlers attached to your elements in the user field, use <code>$("div.user").clone(true, true);</code> instead of <code>$("div.user").clone();</code>.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload