In this post i am going to explain about how to add or remove file fields using jquery and upload using php code. In my previous code Multiple Upload files using php and javascript explained using simple javascript code. Now i will explain using jquery and with less code to implement.
how to add or remove file fields using jquery | Anil Labs
Javascript code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script> <script type="text/javascript" src="http://jquery.offput.ca/js/jquery.highlightFade.js"></script> <script type="text/javascript"> function addFormField() { var id = document.getElementById("aid").value; jQuery.noConflict() jQuery("#divTxt").append("<tr id='row" + id + "' style='width:100%'><td width='20%'><input type='file' name='FileIcons2[]' /></td><td>  <a href='#' onClick='removeFormField("#row" + id + ""); return false;'>Remove</a></td></tr>"); jQuery('#row' + id).highlightFade({ speed:1000 }); id = (id - 1) + 2; document.getElementById("aid").value = id; } function removeFormField(id) { jQuery(id).remove(); } </script> |
In HTML code:
1 2 3 4 5 6 7 |
In the PHP code:
1 2 3 4 5 | <?php for($i=0;$i< count($_FILES['FileIcons2']['name']);$i++){ move_uploaded_file($_FILES['FileIcons2']['tmp_name'][$i],"../headers/".$_FILES['FileIcons2']['name'][$i]); } ?> |
Thanks.
2 Comments
Arka · April 19, 2013 at 5:43 am
awesome bro.
How to manage random header image in joomla | ANIL KUMAR PANIGRAHI 's Blog · July 8, 2011 at 10:15 am
[…] my previous post i have explained about how to add or remove file fields using jquery, Try to use this code in your application and upload images to […]