Wednesday, 15 May 2013

jQuery clone form field till maximum count -



jQuery clone form field till maximum count -

i allowing user add together more field on click. want allow user add together maximum 4 fields. how can alter code create works. when user creates total 4 elements add photo button should turns disable mode or hide. prefer disable if hard hide fine.

jquery code:

jquery(document).ready(function(){ jquery('#add-photo-button').click(function(){ var current_count = jquery('input[type="file"]').length; var next_count = current_count + 1; jquery('#file-upload').prepend('<input type="file" name="photo_' + next_count + '" />'); }); });

html code:

<form id="file-upload" action="#" method="get" enctype="multipart/form-data"> <div id="image-uploader-box" class="group"> <div id="forms" class="add-photo-fields"> <input type="submit" value="upload" /> <input type="button" id="add-photo-button" class="add-photo-button" value="add photo"/> </div> </div> </form>

thanks lot

try this

demo

jquery(document).ready(function(){ $cnt = 1; jquery('#add-photo-button').click(function(){ if($cnt == 4){ //$('#add-photo-button').hide(); $('#add-photo-button').prop('disabled', true); } $cnt++; var current_count = jquery('input[type="file"]').length; var next_count = current_count + 1; jquery('#file-upload').prepend('<input type="file" name="photo_' + next_count + '" />'); }); });

jquery forms clone field

No comments:

Post a Comment