<form action="ajax.php" method="POST" id="request-form" enctype="multipart/form-data">
<select name="car">
<option value="">Choose</option>
</select>
<input type="text" name="address"/>
<input type="text" name="zip"/>
<input type="file" name="typeoneimage" class="typeone"/>
<input type="file" name="typetwoimage" class="typetwo"/>
</form>
<input type="button" value="Add more file"/>
Thats my basic form, but by click on button more input tags of file type can be added via jquery, like
<input type="file" name="typeoneimage" class="typeone"/>
<input type="file" name="typetwoimage" class="typetwo"/>
Here is my javascript code to upload that form's data, but the only the last files are sent to the server via ajax, the rest of the files are missing, I want to send these files as an array typeone images in one array and typetwo images in send array. How can I achieve this, please guide me.
function postRequest(car,address,zip,typeoneimg,typetwoimg)
{
return $.ajax({
type:'POST',
url:"ajax.php",
contentType: false,
processData: false,
async:false,
cache:false,
data:{"car":car,"address":address,"zip":zip,"typeOneImage":typeoneimg,"typeTwoImage":typetwoimage}
});
}
var typeOneImages=new Array();
var typeTwoImages=new Array();
$(form).on("submit",function(e){
$.each(".typeone",function(){
typeOneImages.push($(this).file[0]);
});
$.each(".typetwo",function(){
typeTwoImages.push($(this).file[0]);
});
//postRequest function call here
e.preventDefault();
});