2016-02-22 2 views
5

मैं इस तरह यूआई हो रहा है में ajax का उपयोग कर कई छवियों को अपलोड करते हैं:
enter image description hereमैं कैसे php

मैं एकाधिक वीडियो php में ajax का उपयोग कर अपलोड करना चाहते हैं। इसके लिए मैंने jQuery में FormData() की कोशिश की। लेकिन यह केवल एक छवि अपलोड कर रहा है, उससे अधिक नहीं।

मेरा फ़ॉर्म फ़ाइल:

<form enctype="multipart/form-data" action="/test.php" 
method="post" class="putImages"> 
    <input name="media[]" type="file" multiple/> 
    <input class="button" type="submit" alt="Upload" value="Upload" /> 
    <button type="button" id="add"></button> 
</form> 

मेरे jQuery फ़ाइल:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#add").click(function() { 
      var $div = $('div[id^="inputdiv"]:last'); 
      var num = parseInt($div.prop("id").match(/\d+/g), 10) + 1; 
      var $klon = $div.clone().prop('id', 'inputdiv' + num).appendTo("#athleteRegister").insertBefore("#submitbutton"); 
      $('#inputdiv' + num).find("input").attr('name', 'file[' + num + ']'); 
      $('#inputdiv' + num).find("input").val(""); 
      $('#inputdiv' + num).find("input").attr('id', 'file' + num); 
      $('#inputdiv' + num).find("input").css("outline", "none"); 
      $('#inputdiv' + num).find("div.col-sm-1 i").attr('class', 'fa fa-minus'); 
      $('#inputdiv' + num).find("div.col-sm-1 button").attr('id', 'remove'); 
      $('#inputdiv' + num).find("img").attr('alt', 'remove'); 
     }); 
     $('#sub').click(function() { 
      jQuery.each($('input[name^="media"]')[0].files, function(i, file) { 
       data.append('file-' + i, file); 
      }); 
      $.ajax({ 
       type: 'POST', 
       data: data, 
       url: "../admins/test", 
       cache: false, 
       contentType: false, 
       processData: false, 
       success: function(data) { 
        alert(data); 
       } 
      }); 
     }); 
    }); 
</script> 

किसी को भी इस समस्या को हल कर सकते हैं? धन्यवाद!

+1

का उपयोग कर कृपया 'serializeArray() का उपयोग' सर्वर साइड करने के लिए आदानों भेजने के लिए द्वारा कार्यान्वित। या आप किसी भी तृतीय पक्ष प्लगइन का उपयोग कर सकते हैं, जैसे https://blueimp.github.io/jQuery-File-Upload/ – Nisam

+0

@ निसान मुझे केवल उपरोक्त कोड का उपयोग करके निष्पादित करने की आवश्यकता है –

उत्तर

1

AJAX फ़ाइल अपलोड के लिए मैं dropzone.js का उपयोग करने की सलाह दूंगा। इसमें एक शानदार दस्तावेज है और लचीलापन बहुत अच्छा है।