Multifile upload is not working when form cloning with jquery
I have to generate multiple dynamic forms. These forms contains file input element. I have to upload multiple files. For dynamic form generation I used Jquery clone method , for multiple file upload I have used Jquery fyneworks plugin (http://www.fyneworks.com/jquery/multiple-file-upload/).

Whenever I clone the form I will assign ids dynamically. After cloning the form the file plugin is not working properly. It always adding to first form even though I am assigning ids dynamically.

I have created simple test scenario with following code. 

Could any one please help me.   

Thanks   



    <html>
    <head>
    <script src='jquery-1.6.1.js' type="text/javascript"></script>
     <script src='jquery.MultiFile.js' type="text/javascript" language="javascript"></script>
     <script src='jquery.blockUI.js' type="text/javascript" language="javascript"></script>
    
     <script>
     var i=0;
     $(function(){
    	//$("#div0").hide();
     });
     
           function addMoreForms(){
    			i++;
    			var x = $("#div0").clone(true);//.insertAfter($("#myForm"));
    			$(x).attr("id", "div"+i);
    			$(x).find("#myForm0").attr("id","myForm"+i);
    			$(x).find("#file0_wrap").attr("id","file"+i+"_wrap");
    			$(x).find("#file0_wrap_list").attr("id","file"+i+"_wrap_list");
    			$(x).find("#file0").attr("id","file"+i).attr("name","file"+i).attr("class","multi");
               //$("#myForm").append('<input type="file" name="files[]" class="multi"/>')
    		    $(x).show();
    		    $(x).insertAfter('#div'+(i-1));
           }
    
     </script>
    
    </head>
    <body>
    <div id="div0">
    <form id="myForm0" action="your-action">
        <input id="file0" type="file" name="file0" class="multi" maxlength="3"/>
    </form>
    </div>
    <div>
     <a href="#" onclick="addMoreForms()">Add More</a>
     </div>
    </body>
    </html>





Multifile upload is not working when form cloning with jquery
===

I have to generate multiple dynamic forms. These forms contains file input element. I have to upload multiple files. For dynamic form generation I used Jquery clone method , for multiple file upload I have used Jquery fyneworks plugin (http://www.fyneworks.com/jquery/multiple-file-upload/).

Whenever I clone the form I will assign ids dynamically. After cloning the form the file plugin is not working properly. It always adding to first form even though I am assigning ids dynamically.

I have created simple test scenario with following code. 

Could any one please help me.   

Thanks   



    <html>
    <head>
    <script src='jquery-1.6.1.js' type="text/javascript"></script>
     <script src='jquery.MultiFile.js' type="text/javascript" language="javascript"></script>
     <script src='jquery.blockUI.js' type="text/javascript" language="javascript"></script>
    
     <script>
     var i=0;
     $(function(){
    	//$("#div0").hide();
     });
     
           function addMoreForms(){
    			i++;
    			var x = $("#div0").clone(true);//.insertAfter($("#myForm"));
    			$(x).attr("id", "div"+i);
    			$(x).find("#myForm0").attr("id","myForm"+i);
    			$(x).find("#file0_wrap").attr("id","file"+i+"_wrap");
    			$(x).find("#file0_wrap_list").attr("id","file"+i+"_wrap_list");
    			$(x).find("#file0").attr("id","file"+i).attr("name","file"+i).attr("class","multi");
               //$("#myForm").append('<input type="file" name="files[]" class="multi"/>')
    		    $(x).show();
    		    $(x).insertAfter('#div'+(i-1));
           }
    
     </script>
    
    </head>
    <body>
    <div id="div0">
    <form id="myForm0" action="your-action">
        <input id="file0" type="file" name="file0" class="multi" maxlength="3"/>
    </form>
    </div>
    <div>
     <a href="#" onclick="addMoreForms()">Add More</a>
     </div>
    </body>
    </html>




