2012-11-05 35 views
21

मेरे पास एक HTML फॉर्म है जिसे एक अनुरोध में मौजूदा REST API में 3 भागों को अपलोड करने की आवश्यकता है। मुझे फॉर्मडेटा सबमिशन पर सीमा निर्धारित करने के तरीके पर प्रलेखन नहीं मिल रहा है।एकाधिक फाइलों के साथ jquery AJAX FormData() का उपयोग करते समय एक मल्टीपार्ट/फॉर्म-डेटा अनुरोध पर सीमा निर्धारित करने के लिए

मैं यहाँ दिए गए उदाहरणों का अनुसरण करने का प्रयास किया: How to send FormData objects with Ajax-requests in jQuery?

हालांकि जब मैं डेटा यह निम्नलिखित स्टैकट्रेस साथ अस्वीकार कर दिया जाता है प्रस्तुत:

Caused by: org.apache.commons.fileupload.FileUploadException: the request was rejected because no multipart boundary was found. 

मैं एक सीमा निर्धारित कर सकते हैं कैसे?

यहाँ HTML/जावास्क्रिप्ट है:

<form name="formSubmit" action="#"> 
    userId: <input id="userId" name="userId" value=""/><br/> 
    locale: <input name="locale" value="en_US"/><br/> 
    front Image: <input type="file" name="frontImage"/><br/> 
    back Image: <input type="file" name="backImage"/><br/> 
    <input type="button" onclick="handleSubmit();" value="Submit"/> 
</form> 

किसी भी मदद के लिए अग्रिम धन्यवाद:

<script type="text/javascript"> 
    function handleSubmit() { 


     var jsonString = "{" + 
       "\"userId\":\"" + document.formSubmit.userId.value + "\"" + 
       ",\"locale\":\"" + document.formSubmit.locale.value + "\"" + 
       "}"; 

     var data = new FormData(); 
     data.append('Json',jsonString); 
     data.append('frontImage', document.formSubmit.frontImage.files[0]); 
     data.append('backImage', document.formSubmit.backImage.files[0]); 

     document.getElementById("sent").innerHTML = jsonString; 
     document.getElementById("results").innerHTML = ""; 
     $.ajax({ 
        url:getFileSubmitUrl(), 
        data:data, 
        cache: false, 
        processData: false, 
        contentType: 'multipart/form-data', 
        type:'POST', 
        success:function (data, status, req) { 
         handleResults(req); 
        }, 
        error:function (req, status, error) { 
         handleResults(req); 
        } 
       }); 
    } 

</script> 

यहाँ फार्म है!

+3

बदलें 'contentType' को' FALSE', समान http: // stackoverflow

यहाँ ajax कॉल कि काम किया है। कॉम/प्रश्न/12831680/jquery-ajax-multipart-form-data-not-send-data – Musa

उत्तर

21

मूसा की प्रतिक्रिया बहुत अच्छी रही। सामग्री को सेट करना गलत पर टाइप करें, फ़ॉर्म डेटा को सही तरीके से सबमिट करें। धन्यवाद!

$.ajax({ 
    url:getFileSubmitUrl(), 
    data:data, 
    cache:false, 
    processData:false, 
    contentType:false, 
    type:'POST', 
    success:function (data, status, req) { 
     handleResults(req); 
    }, 
    error:function (req, status, error) { 
     handleResults(req); 
    } 
}); 

मैंने यह भी पाया है कि इस कोड भी काम किया:

var oReq = new XMLHttpRequest(); 
     oReq.open("POST", getFileSubmitUrl()); 
     oReq.addEventListener("error", transferComplete); 
     oReq.addEventListener("load", transferComplete); 
     oReq.addEventListener("abort", transferComplete); 
     oReq.send(data); 
    } 
    function transferComplete(evt) { 
     handleResults(evt.target); 
    } 
+1

आप खुले/भेजने के बाद ईवेंट श्रोताओं को क्यों जोड़ते हैं? –