दिलचस्प पोस्ट
एंड्रॉयड getResources ()। GetDrawable () नापसंद एपीआई 22 एक पूरे व्यू का एक स्क्रीनशॉट लें ObjC में स्वयं क्या है? मुझे इसका उपयोग कब करना चाहिए? मैं एक regex का उपयोग कर एक स्ट्रिंग में सभी YouTube वीडियो आईडी कैसे प्राप्त करूं? पायथन में एक फ़ोल्डर में सभी मॉड्यूल लोड किए जा रहे हैं PHP लॉग इन स्क्रिप्ट में सत्र और सत्र चर का उपयोग करना UIWebview के अंदर हैंडलिंग स्पर्श होता है JSACH एसएफटीपी लाइब्रेरी का उपयोग करते समय, Java UnknownHostKey को कैसे हल करें? स्पार्क – रीपार्टिशन () बनाम कॉलेसेस () पंडों / अजगर में डेटाफ्रेम में दो कॉलम जोड़ें उनमें से एक पर प्राथमिकता देने के दो मानों के आधार पर क्रमबद्ध करें सीकेके में सी ++ 11 सक्रिय कैसे करें? Google Places API में `सेंसर` का पैरामीटर क्या अच्छा है? मैं VS2012 में C ++ / CLI Winforms ऐप कैसे बनाऊँ? BOOT_COMPLETED एंड्रॉइड काम नहीं कर रहा है

JQuery.ajax के साथ मल्टीपार्ट / फॉर्मडाटा भेजा जा रहा है

JQuery के एजेक्स-फ़ंक्शन का उपयोग करते हुए मुझे एक सर्वर पाठ PHP-स्क्रिप्ट पर फ़ाइल भेजने में एक समस्या है। $('#fileinput').attr('files') साथ फ़ाइल-सूची प्राप्त करना संभव है $('#fileinput').attr('files') लेकिन यह डेटा सर्वर पर कैसे भेजना संभव है? फ़ाइल-इनपुट का उपयोग करते समय सर्वरसाइड php-script पर परिणामस्वरूप सरणी ( $_POST ) 0 ( NULL ) है

मुझे पता है यह संभव है (हालांकि अब तक मुझे कोई भी jQuery समाधान नहीं मिला, केवल प्रोटोटाइ कोड ( http://webreflection.blogspot.com/2009/03/safari-4-multiple-upload-with-progress.html ) )।

यह अपेक्षाकृत नया लग रहा है, इसलिए कृपया उल्लेख नहीं करें कि फाइल अपलोड XHR / Ajax के माध्यम से असंभव होगा, क्योंकि यह निश्चित रूप से काम कर रहा है।

मुझे सफारी 5, एफएफ और क्रोम में कार्यक्षमता की ज़रूरत है लेकिन यह आवश्यक नहीं है।

मेरा कोड अब है:

 $.ajax({ url: 'php/upload.php', data: $('#file').attr('files'), cache: false, contentType: 'multipart/form-data', processData: false, type: 'POST', success: function(data){ alert(data); } }); 

Solutions Collecting From Web of "JQuery.ajax के साथ मल्टीपार्ट / फॉर्मडाटा भेजा जा रहा है"

सफारी 5 / फ़ायरफ़ॉक्स 4 के साथ शुरू, FormData वर्ग का उपयोग करना सबसे आसान है:

 var data = new FormData(); jQuery.each(jQuery('#file')[0].files, function(i, file) { data.append('file-'+i, file); }); 

तो अब आपके पास एक FormData ऑब्जेक्ट है, जो XMLHttpRequest के साथ भेजे जाने के लिए तैयार है।

 jQuery.ajax({ url: 'php/upload.php', data: data, cache: false, contentType: false, processData: false, method: 'POST', type: 'POST', // For jQuery < 1.9 success: function(data){ alert(data); } }); 

यह जरूरी है कि आप contentType विकल्प को false सेट करें, jQuery को आपके लिए एक Content-Type शीर्षलेख जोड़ने के लिए मजबूर नहीं कर रहा है, अन्यथा, सीमा स्ट्रिंग उसमें से गुम होगी। इसके अलावा, आपको प्रक्रिया छोड़ देना चाहिए processData सेट किया गया झंडे, अन्यथा, jQuery आपके FormData को एक स्ट्रिंग में परिवर्तित करने का प्रयास करेगा, जो विफल हो जाएगा।

अब आप फ़ाइल का उपयोग करके PHP में पुनर्प्राप्त कर सकते हैं:

 $_FILES['file-0'] 

(केवल एक फाइल है, file-0 , जब तक आप अपनी फ़ाइल इनपुट पर multiple विशेषता निर्दिष्ट नहीं करते हैं, उस स्थिति में, संख्या प्रत्येक फाइल के साथ बढ़ेगी।)

पुराने ब्राउज़र के लिए फ़ॉर्मडाटा इम्यूलेशन का उपयोग करना

 var opts = { url: 'php/upload.php', data: data, cache: false, contentType: false, processData: false, method: 'POST', type: 'POST', // For jQuery < 1.9 success: function(data){ alert(data); } }; if(data.fake) { // Make sure no text encoding stuff is done by xhr opts.xhr = function() { var xhr = jQuery.ajaxSettings.xhr(); xhr.send = xhr.sendAsBinary; return xhr; } opts.contentType = "multipart/form-data; boundary="+data.boundary; opts.data = data.toString(); } jQuery.ajax(opts); 

मौजूदा फॉर्म से फ़ॉर्मडाटा बनाएं

मैन्युअल रूप से फ़ाइलों को चलाने के बजाय, फॉर्मडाटा ऑब्जेक्ट भी एक मौजूदा फॉर्म ऑब्जेक्ट की सामग्री के साथ बनाया जा सकता है:

 var data = new FormData(jQuery('form')[0]); 

काउंटर के बजाय एक PHP मूल सरणी का उपयोग करें

बस अपने फ़ाइल तत्वों को समान नाम दें और नाम को कोष्ठक में समाप्त करें:

 jQuery.each(jQuery('#file')[0].files, function(i, file) { data.append('file[]', file); }); 

$_FILES['file'] तब अपलोड की गई प्रत्येक फ़ाइल के लिए फाइल अपलोड फ़ील्ड वाले एक सरणी होगी मैं वास्तव में अपने शुरुआती समाधान के बारे में सलाह देता हूं क्योंकि यह पुनरावृत्त करने के लिए आसान है

मैंने अभी कुछ जानकारी के आधार पर इस फ़ंक्शन का निर्माण किया है।

इसे इस्तेमाल करने की तरह प्रयोग .serialize() , बजाय सिर्फ डाल .serializefiles();
मेरे परीक्षणों में यहां काम करना

 //USAGE: $("#form").serializefiles(); (function($) { $.fn.serializefiles = function() { var obj = $(this); /* ADD FILE TO PARAM AJAX */ var formData = new FormData(); $.each($(obj).find("input[type='file']"), function(i, tag) { $.each($(tag)[0].files, function(i, file) { formData.append(tag.name, file); }); }); var params = $(obj).serializeArray(); $.each(params, function (i, val) { formData.append(val.name, val.value); }); return formData; }; })(jQuery); 

बस राफेल के महान उत्तर को थोड़ा जोड़ना चाहता था। यहां प्रस्तुत करने के लिए PHP को उसी $_FILES का उत्पादन करना है, चाहे आप जावास्क्रिप्ट को सबमिट करने के लिए उपयोग करें।

HTML प्रपत्र:

 <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" /> </form> 

जावास्क्रिप्ट के बिना जमा किए जाने पर PHP, $_FILES उत्पादन करता है:

 Array ( [media] => Array ( [name] => Array ( [0] => Galata_Tower.jpg [1] => 518f.jpg ) [type] => Array ( [0] => image/jpeg [1] => image/jpeg ) [tmp_name] => Array ( [0] => /tmp/phpIQaOYo [1] => /tmp/phpJQaOYo ) [error] => Array ( [0] => 0 [1] => 0 ) [size] => Array ( [0] => 258004 [1] => 127884 ) ) ) 

यदि आप प्रगतिशील वृद्धि करते हैं, तो फाइल सबमिट करने के लिए राफेल के जे एस का उपयोग कर …

 var data = new FormData($('input[name^="media"]')); jQuery.each($('input[name^="media"]')[0].files, function(i, file) { data.append(i, file); }); $.ajax({ type: ppiFormMethod, data: data, url: ppiFormActionURL, cache: false, contentType: false, processData: false, success: function(data){ alert(data); } }); 

… यह है कि पीएचपी की $_FILES सरणी इस तरह दिखती है, कि उस जावास्क्रिप्ट को सबमिट करने के बाद:

 Array ( [0] => Array ( [name] => Galata_Tower.jpg [type] => image/jpeg [tmp_name] => /tmp/phpAQaOYo [error] => 0 [size] => 258004 ) [1] => Array ( [name] => 518f.jpg [type] => image/jpeg [tmp_name] => /tmp/phpBQaOYo [error] => 0 [size] => 127884 ) ) 

यह एक अच्छी सरणी है, और वास्तव में जो कुछ लोग $_FILES में बदलाव करते हैं, लेकिन मुझे लगता है कि अगर जावास्क्रिप्ट को प्रस्तुत करने के लिए इस्तेमाल किया गया था, तो यह वही $_FILES साथ काम करने में उपयोगी है। इसलिए, जेएस के कुछ मामूली बदलाव यहां दिए गए हैं:

 // match anything not a [ or ] regexp = /^[^[\]]+/; var fileInput = $('.putImages input[type="file"]'); var fileInputName = regexp.exec( fileInput.attr('name') ); // make files available var data = new FormData(); jQuery.each($(fileInput)[0].files, function(i, file) { data.append(fileInputName+'['+i+']', file); }); 

(14 अप्रैल 2017 संपादित करें: मैंने फार्म तत्व को फॉर्मडाटा के निर्माता से निकाला था) – जो सफारी में इस कोड को तय करता है।)

उस कोड में दो चीजें होती हैं

  1. input नाम विशेषता को स्वचालित रूप से पुनर्प्राप्त करता है, HTML को अधिक योग्य बनाने के लिए। अब, जब तक form में कक्षाएं डाल दी जाती हैं, बाकी सब कुछ स्वचालित रूप से ख्याल रखा जाता है यही है, input में कोई विशेष नाम नहीं है।
  2. सरणी स्वरूप जो सामान्य HTML सबमिट करता है, उसे जावास्क्रिप्ट द्वारा डेटा में बनाया जाता है। Append लाइन ब्रैकेट नोट करें

इन परिवर्तनों के साथ, जावास्क्रिप्ट के साथ प्रस्तुत करने से अब सरल एचटीएमएल के साथ प्रस्तुत करने के ठीक उसी $_FILES सरणी का उत्पादन होता है।

मेरे कोड को देखो, यह मेरे लिए नौकरी करता है

 $( '#formId' ) .submit( function( e ) { $.ajax( { url: 'FormSubmitUrl', type: 'POST', data: new FormData( this ), processData: false, contentType: false } ); e.preventDefault(); } ); 

यदि आपके HTML में आपके फ़ॉर्म को परिभाषित किया गया है, तो फ़ॉर्म को पुनरावृत्त करना और छवियां जोड़ने की तुलना में फ़ॉर्म को कन्वर्टर में देना आसान होता है

 $('#my-form').submit( function(e) { e.preventDefault(); var data = new FormData(this); // <-- 'this' is your form element $.ajax({ url: '/my_URL/', data: data, cache: false, contentType: false, processData: false, type: 'POST', success: function(data){ ... 

डेविन वेनेबल का उत्तर जो मैं चाहता था, उसके करीब था, लेकिन मैं एक चाहता था जो कई रूपों पर काम करेगा, और पहले से ही फॉर्म में निर्दिष्ट क्रिया का उपयोग करे ताकि प्रत्येक फाइल सही जगह पर जा सके।

मैं भी jQuery के () विधि का उपयोग करना चाहता था ताकि मैं।

यह मुझे इस पर मिला: (अपने jQuery चयनकर्ता के साथ फॉर्म स्टाइलर को बदलें)

 $(document).on('submit', formSelecter, function( e ) { e.preventDefault(); $.ajax( { url: $(this).attr('action'), type: 'POST', data: new FormData( this ), processData: false, contentType: false }).done(function( data ) { //do stuff with the data you got back. }); }); 

फॉर्मडाटा वर्ग काम करता है, हालांकि आईओएस सफारी में (आईफोन पर कम से कम) मैं राफेल श्वेइकर के समाधान का उपयोग करने में सक्षम नहीं था।

मोज़िला देव के फॉर्मडाटा ऑब्जेक्ट को छेड़छाड़ करने के लिए एक अच्छा पृष्ठ है।

इसलिए, अपने पृष्ठ में कहीं एक रिक्त फ़ॉर्म जोड़ें, enctype निर्दिष्ट करें:

 <form enctype="multipart/form-data" method="post" name="fileinfo" id="fileinfo"></form> 

फिर, फॉर्मडाटा ऑब्जेक्ट को इस रूप में बनाएं:

 var data = new FormData($("#fileinfo")); 

और राफेल के कोड के रूप में आगे बढ़ें

एक पकड़ वाला जो आज मुझे मिला, मुझे लगता है कि इस समस्या से संबंधित बातों के मुताबिक सही है: अगर एजेक्स कॉल के यूआरएल को पुनः निर्देशित किया जाता है तो सामग्री-प्रकार के लिए शीर्षक: 'बहुस्तृत / फॉर्म-डाटा' खोया जा सकता है।

उदाहरण के लिए, मैं http://server.com/context?param=x पर पोस्ट कर रहा था

क्रोम के नेटवर्क टैब में मैंने इस अनुरोध के लिए सही मल्टीपार्ट हेडर देखा था लेकिन फिर एक 302 http://server.com/context/?param=x पर रीडायरेक्ट (संदर्भ के बाद स्लैश नोट करें)

रीडायरेक्ट के दौरान मल्टीपार्ट हेडर खो गया था। सुनिश्चित करें कि यदि आपके लिए ये समाधान काम नहीं कर रहे हैं तो अनुरोध पुनर्निर्देशित नहीं किए जा रहे हैं।

  1. jquery-> $ ("# id") द्वारा फ़ॉर्म ऑब्जेक्ट प्राप्त करें [0]
  2. डेटा = नया फॉर्मडाटा ($ ("# id") [0]);
  3. ठीक है, डेटा आपकी पसंद है

एजेएक्स के विकल्प के रूप में, आप अपने दस्तावेज़ में एक छिपी हुई आइफ्रेम जोड़ सकते हैं, वहां अपना प्रपत्र कॉपी कर सकते हैं और उसे पोस्ट कर सकते हैं (ताकि आपके दृश्य पृष्ठ में कोई रीडायरेक्शन न हो)। मुझे लगता है कि आप बाद में iframe को हटा सकते हैं

(एचटीएमएल और जेएस हैकर्स के लिए प्रौद्योगिकियों हैं, प्रोग्रामर के लिए नहीं.आप को इस से अपना तरीका हैक करना होगा … यह हो रहा है … भगवान जानता है कि पैचिंग और 'विकसित' जेएस और एचटीएमएल के कितने साल और आप अभी भी कर सकते हैं ' बाहरी लिब्स उपयोग किए बिना इतना आसान कुछ नहीं कर सकता। मैं इससे बीमार हूँ। (मैं एचटीएमएल 5 के बारे में जानता हूं, यह सिर्फ पर्याप्त नहीं है और व्यापक रूप से समर्थित नहीं है)