चयन पर फ़ाइल अपलोड करें

Question

आम तौर पर, फ़ाइल अपलोड करने के लिए, यह दो-चरण प्रक्रिया होगी - एक फ़ाइल का चयन करें और फिर अपलोड की पुष्टि करें। मैं प्रोफ़ाइल तस्वीर अपलोड करने पर काम कर रहा हूं। चूंकि प्रोफ़ाइल तस्वीर आमतौर पर छोटा होता है, इसलिए मैं फ़ाइल चयन पर फ़ाइल अपलोड करने के लिए अपने उपयोगकर्ताओं के लिए माउस-क्लिक को कम करना चाहता हूं। कृपया यह सुनिश्चित करने के लिए अच्छे, और शायद आम, तरीके सुझाएं (मैं भी उनके नुकसान, यदि कोई हो, सीखना चाहूंगा)। धन्यवाद।

Answer 1

change ईवेंट फ़ाइल फ़ाइल से फ़ाइल चयनित होने पर change ईवेंट आग लग जाएगा। फ़ील्ड का मान '' होगा यदि कोई फ़ाइल चयनित नहीं है (फ़ील्ड साफ़ हो गया है)।

<form method="post" action="upload.script"> 
    <input type="file" id="formfile"/> 
    <input type="submit" id="formsubmit"/> 
</form> 

<script type="text/javascript"> 
    var file= document.getElementById('formfile'); 
    var submit= document.getElementById('formsubmit'); 

    // If scripting is available, can auto-submit the form, so no submit 
    // button needed. 
    // 
    submit.parentNode.removeChild(submit); 

    // When field is filled in with a filename, submit form 
    // 
    file.onchange= function() { 
     if (this.value!=='') 
      this.form.submit(); 
    }; 
</script> 

क्या यह एक अच्छा विचार है? संदिग्ध। यदि उपयोगकर्ता अपेक्षा नहीं करता है कि इसका नकारात्मक प्रभाव हो सकता है तो स्वचालित रूप से एक फ़ॉर्म सबमिट करना।

Answer 2

आप JQuery इस्तेमाल कर सकते हैं स्वचालित रूप से चयन पर Sever के लिए फ़ाइल पोस्ट करने के लिए ...

समस्याएं:

क्या होगा यदि उपयोगकर्ता does not है कि फ़ाइल का चयन करना चाहते हैं लेकिन फ़ाइल पहले से ही पर अपलोड किया गया है सर्वर?

फ़ाइल अपलोड होने से पहले पिछली जगह होने पर क्या होगा?

उपयोगकर्ता कब कुछ भी नहीं करता है और पृष्ठ को बंद करता है? आप फ़ाइल को कब तक रखेंगे

Answer 3

यदि आप जीमेल का उपयोग करते हैं, तो आप देखेंगे कि उनके पास ई-मेल में फ़ाइलों को जोड़ने के लिए ड्रैग-ड्रॉप समाधान है। अपने डेस्कटॉप से ​​एक पूर्वनिर्धारित क्षेत्र और wallah पर खींचें।

यदि आपके पास इसका उपयोग करने वाले लोगों के लिए HTML5 समर्थन है (अधिकतर यदि वे अद्यतित रह रहे हैं) तो आप HTML5 में निर्मित ड्रैग-ड्रॉप का उपयोग कर सकते हैं।

इस में देखने का प्रयास: http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api-tutorial/

तुम भी plupload की तरह कुछ दे सकता है एक कोशिश (http://www.plupload.com/), लेकिन यह है कि इस के लिए overkill हो सकता है। प्लूपलोड उन बड़ी फ़ाइलों के लिए उपयुक्त होगा जिनके लिए प्रगति एनिमेशन और चंकिंग की आवश्यकता है। हालांकि, मुझे पता है कि आप इसे स्क्रिप्ट करने में सक्षम होंगे जैसे अपलोड तुरंत शुरू होता है और जैसे ही यह पूरा हो जाता है आप रीडायरेक्ट करते हैं। इसे सर्वर-साइड काम की भी आवश्यकता हो सकती है जिसे आप सेट अप नहीं कर रहे हैं।