jQuery - Adding field fields dynamically -
im trying implement code found on website duplicates file field when click href link, code pretty same site, yet not working @ all.
could have , let me know im going wrong.
the complete code follows:
javascript:
<script> $( function(){ var jaddnewupload = $( "#add-file-upload" ); jaddnewupload .attr( "href", "javascript:void( 0 )" ) .click( function( objevent ){ addnewupload(); objevent.preventdefault(); return( false ); } ); } ); function addnewupload(){ var jfilescontainer = $( "mpfiles" ); var juploadtemplate = $( "#element-templates div.row" ); var jupload = juploadtemplate.clone(); var strnewhtml = jupload.html(); var intnewfilecount = (jfilescontainer.find( "div.row" ).length + 1); jupload.attr( "id", ("file" + intnewfilecount) ); strnewhtml = strnewhtml .replace( new regexp( "::field3::", "i" ), ("mpfile[]") ); jupload.html( strnewhtml ); jfilescontainer.append( jupload ); } </script>
html:
<div id="mpfiles"> <div class="row"> <label>files:</label> <div class="files-box"> <div class="file sub-file"> <input class="file-input-area" name="mpfile[]" type="file" size="32" value="" /> <input readonly="readonly" class="text" type="text" value="click upload" /> <a href="#" class="button">view</a> </div> </div> </div> </div> <div id="element-templates" style="display: none;"> <div class="row"> <label>files:</label> <div class="files-box"> <div class="file sub-file"> <input class="file-input-area" type="file" name="::field3::" size="32" value="" /> <input readonly="readonly" class="text" type="text" value="click upload" /> <a href="#" class="button">view</a> </div> </div> </div> </div> <div class="row"> <label> </label> <a href="" id="add-file-upload">upload file</a> </div>
the website got code here http://www.bennadel.com/blog/1375-ask-ben-dynamically-adding-file-upload-fields-to-a-form-using-jquery.htm
function addnewupload(){ var jfilescontainer = $( "mpfiles" );
you need #
before mpfiles
... this:
function addnewupload(){ var jfilescontainer = $( "#mpfiles" );
Comments
Post a Comment