javascript - Adding fields using jquery -


i'm trying allow user add , remove email fields in view using jquery. whenever either link click nothing happens.

html/cshtml

<div id="emailsection">   <ul>     <li>email(s) send notice to.</li>      <li><input type="email" name="emails[]" /><a href="#" class="remove_field">remove</a></li>      <li><a class="add_email_button ui-button" href="#" >add email</a></li>   </ul> </div> 

js

<script type="text/javascript">     $(document).ready(         function() {            ...             $('.remove_field').on("click", function (e) {                 e.preventdefault();                 $(this).parent('li').remove();             });             $('.add_email_button').on('click', function (e) {                 e.preventdefault();                 $(this).insertbefore('<li><input type="email" name="emails[]" /><a href="#" class="remove_field">remove</a></li>');             });         }     );  </script> 

here fiddle

the insertbefore must used on other way :

$(/* need insert */ ).insertbefore(/* before ?*/); 

in case must use :

var html = '<li><input type="email" name="emails[]" /><a href="#" class="remove_field">remove</a></li>'; $(html).insertbefore( $(this) ); 

works me : http://jsfiddle.net/yj6ydbgp/

---------[ edit ]------------

for remove:

1/ need create event on parent, check new remove button (or they'll not click event after creation).

2/ waqnt delete < li > parent, , not < div > parent.

new, working add , remove http://jsfiddle.net/yj6ydbgp/1/


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

jsf - How to ajax update an item in the footer of a PrimeFaces dataTable? -

django - CSRF verification failed. Request aborted. CSRF cookie not set -