jQuery - $ .post

Question

का उपयोग कर $ _FILES सरणी प्राप्त करना मैं jQuery के माध्यम से एक फॉर्म जमा करने का प्रयास कर रहा हूं। मेरे रूप में फ़ील्ड और एक फ़ाइल है जो अपलोड की जानी चाहिए। यह ENCTYPE="multipart/form-data" प्रकार है।

मैं अपने सभी फ़ील्ड मान प्राप्त कर सकता हूं: post = $('#myForm').serialize(); लेकिन मैं $_FILES सरणी कैसे प्राप्त करूं? अपलोड की गई फाइल को संसाधित करने के लिए मुझे इसकी आवश्यकता है।

क्या यह jQuery का उपयोग कर संभव है, और यदि ऐसा है तो कैसे? या मुझे jQuery के लिए एक विशेष अपलोड प्लगइन का उपयोग करने की आवश्यकता है?

Answer 1

आप जावास्क्रिप्ट के माध्यम से फ़ाइलों को अपलोड नहीं कर सकते हैं।
Is it possible to use Ajax to do file upload?

अनिवार्य रूप से, फ़ाइल अपलोड करने के लिए की "faking" AJAX दो सबसे लोकप्रिय तरीकों SWFUpload के रूप में एक फ्लैश प्लगइन ऐसे उपयोग कर या एक छिपा iframe पर पर्चे को जमा किया जाता है कि प्रक्रियाओं:

इस संबंधित सवाल बाहर की जाँच करें अनुरोध।

Answer 2

jQuery प्रपत्र यह करने के लिए सबसे अच्छा तरीका है, आप इसे किसी भी सामान्य रूप में जोड़ सकते हैं,

<form method="post" action="URL"> 
<input type="file" name="file"> 
<input type="text" name"text"> 
<input type="submit"> 
</form> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $(form).ajaxForm(); 
}) 
</script> 

अपेक्षा के अनुरूप काम करेंगे, लेकिन ajax के साथ है।

http://malsup.com/jquery/form/#code-samples

Answer 3

आप पर्यावरण, जैसे, कहते हैं, आप एक इंट्रानेट जिसमें आप ब्राउज़र की सिफारिश के लिए एक व्यवस्थापक एप्लिकेशन लिख रहे हैं पर नियंत्रण कर सकते हैं, तो असली AJAX फ़ाइल अपलोड संभव Firefox 3 और इसके बाद के संस्करण के साथ कर रहे हैं। अन्य सभी मामलों में, आईफ्रेम वर्कअराउंड या फ्लैश आधारित अपलोडर जाने का तरीका है।

Answer 4

यह संभव है, लेकिन Google क्रोम में काम नहीं कर रहा है) देखो!

... 
<form method='post' enctype='multipart/form-data'> 
<input type="file" id="imf" name="imf"/> 
<input type="button" id="Save"/> 
</form> 

... 

$("#Save").live("click", function(){ 

var photo = document.getElementById("imf"); 
var file = photo.files[0]; 

    $.post('/user/saveNewPhoto', {'imf':file.getAsDataURL(), fname:file.fileName }, function(data){ 
    alert (data); 
    }); 

}); 

अपलोड साइड स्क्रिप्ट बेस 64 डिकोड जरूरत) और कहा कि सभी है, लेकिन मैं बड़ा आकार फ़ाइल पर इस स्क्रिप्ट

Answer 5

फार्म एक फ़ाइल इनपुट शामिल परीक्षण नहीं है, लेकिन याद आ रही है विधि = पोस्ट और enctype = फॉर्म पर मल्टीपार्ट/फॉर्म-डेटा। फ़ाइल नहीं भेजा जाएगा

Answer 6

उपयोग FormData

<form> 
<label for="imageToSend">Cargar imagen a la galeria</label> 
<input type="file" name="imageToSend" id="imageToSend" value="Cargar imagen" /> 
</form> 
<script> 
$('#imageToSend').on('change',function(event){ 
    var dialog = $('#dialog'); 
    var Data = new FormData(); 
    Data.append('imageToSend',$('#imageToSend')[0].files); 
    $(this).val('');//Clear input file 
    $.ajax({ 
     url: "/upload", 
     data: Data, 
     processData: false, 
     contentType: false, 
     type:'POST', 
     success: function(data){ 
      if(data.success){ 
       //success handler 
      }else if(!data.success){ 
       //error backend handler 
      } 
     }, 
     error: function(data){ 
      //error handler Ej:404 status 
     } 
    }) 
    }); 
</script>