Note that there are some explanatory texts on larger screens.

plurals
  1. PORemoving dynamically generated textboxes in JQuery
    text
    copied!<p>I've spent most of my time working with PHP/HTML, and a small script I'm writing for my sanity (Paperwork, way too much paperwork.) has forced me to use JQuery. I've Searched on Google, SO, and more, but I haven't found anything close to resembling the code I'm currently using or I get lost in the language.</p> <p>The code below is basically an dynamic form, with the ability to add text boxes as required. Each new generated text box is required (HTML5) for the form submission, but if I create an extra text box that's unneeded, I would like to be able to remove it (So it doesn't leave me with a field I don't need, and can't submit the form because it's required).</p> <p>JFiddle: <a href="http://jsfiddle.net/fmdx/jZU97/" rel="nofollow">http://jsfiddle.net/fmdx/jZU97/</a> (using JQuery 1.10.1)</p> <p>HTML</p> <pre><code>&lt;div&gt; &lt;input type="checkbox" id="customcheck" name="custom" href="#custom"&gt;Custom Exceptions Needed?&lt;/div&gt; &lt;div id="custom" style="padding-left:40px;"&gt; &lt;input type="text" id="exception_1" placeholder="Six foot utility..."&gt;&lt;br&gt; &lt;/div&gt;&lt;!-- Ending Custom Div --&gt; &lt;div style="padding-left:40px;"&gt;&lt;a id="add_field" href="#"&gt;&lt;span&gt;Add Another Exception&lt;/span&gt;&lt;/a&gt; &lt;/div&gt; </code></pre> <p>JQuery</p> <pre><code>var counter = 1; $(function () { $('a#add_field').click(function () { counter += 1; $('#custom').append( '&lt;input id="exception_' + counter + '" name="dynfields[]' + '" type="text" placeholder="Six foot utility..." required&gt;&lt;a href="#"&gt;Remove&lt;/a&gt;&lt;br&gt;'); }); }); </code></pre> <p>The Basis of the code above I got off of a tutorial that includes on how to take all of the information submitted through these dynamic forms and put them into a database. So, I'm really trying to use this code specifically. (Tutorial: <a href="http://www.infotuts.com/dynamically-add-input-fields-submit-to-database" rel="nofollow">http://www.infotuts.com/dynamically-add-input-fields-submit-to-database</a> )</p> <p>Thanks for any help or advice in advance!</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