JQuery में इनपुट फ़ाइल खाली है या नहीं, इसकी जांच कैसे करें


101

JS के लिए एकदम नया।
मैं यह जांचने की कोशिश कर रहा हूं कि क्या jQuery / JavaScript के साथ फॉर्म सबमिट करते समय फ़ाइल इनपुट तत्व खाली है या नहीं। मैं समाधानों के एक समूह से गुजरा हूं और मेरे लिए कुछ भी काम नहीं कर रहा है। मैं इससे बचने की कोशिश कर रहा हूं /c/fakepath(जब तक कि कोई दूसरा विकल्प न हो)

<input type="file" name="videoFile" id="videoUploadFile" />

यह काम नहीं करता:

var vidFile = $("#videoUploadFile").value;

अगर मुझे निम्नलिखित का उपयोग करने का एकमात्र तरीका फ़ाइल नाम मिल सकता है:

var vidFile = document.getElementById("videoUploadFile").files[0].name;

यदि कोई फ़ाइल उपलब्ध नहीं है तो कोड एक त्रुटि फेंकता है:

अपरिभाषित की संपत्ति का नाम नहीं पढ़ सकते हैं

जो समझ में आता है क्योंकि सरणी सेट नहीं है। लेकिन मैं यह पता नहीं लगा सकता कि इसके साथ किसी भी त्रुटि को कैसे किया जाए।

मैं फ़ाइल इनपुट तत्व को ठीक से कैसे पकड़ सकता हूं videoUploadFile, जांचें कि क्या यह खाली है, यदि यह खाली है तो त्रुटि संदेश फेंकें?


7
जाँच करें .files.length?
तैमू

5
कोई इस सवाल को क्यों टाल देगा? मैं कभी-कभी एसओ को नहीं समझता। मैंने आपको वापस 0.
Seano666

यदि आप फॉर्म में एक से अधिक हैं, तो आप गैर-रिक्त फ़ाइलों को भी फ़िल्टर कर सकते हैं:var files = $('#formbody').find('input[type=file]').filter(function() { return $(this)[0].files.length > 0; });
Piotr Kowalski

जवाबों:



140

यहाँ इसका jQuery संस्करण है:

if ($('#videoUploadFile').get(0).files.length === 0) {
    console.log("No files selected.");
}

1
यह उत्तर अधिक उपयुक्त है क्योंकि ओपी ने JQuery समाधान के लिए कहा था।
हुसैन अकबर

$('#videoUploadFile').get(0)उसी के रूप में $('#videoUploadFile')[0]लेकिन शायद get()कुछ पवित्रता की जाँच करता है
झंडेश्वर

18

यह जाँचने के लिए कि फ़ाइल लंबाई गुण का उपयोग करके इनपुट फ़ाइल खाली है या नहीं, indexनिम्नलिखित की तरह निर्दिष्ट किया जाना चाहिए:

var vidFileLength = $("#videoUploadFile")[0].files.length;
if(vidFileLength === 0){
    alert("No file selected.");
}

3

प्रश्न: कैसे चेक करें कि फाइल खाली है या नहीं?

उत्तर: मैंने इस मुद्दे को इस Jquery कोड का उपयोग करके प्राप्त किया है

//If your file Is Empty :     
      if (jQuery('#videoUploadFile').val() == '') {
                       $('#message').html("Please Attach File");
                   }else {
                            alert('not work');
                   }

    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="videoUploadFile">
<br>
<br>
<div id="message"></div>


1
आगे यह स्पष्टीकरण क्यों यह काम करेगा या मूल प्रश्न में क्या गलत था, इस उत्तर की गुणवत्ता को बढ़ाने में मदद करेगा।
जोश बर्गेस

@ जोश में यह उत्तर था कि फ़ाइल की जाँच कैसे की जाती है फ़ाइल खाली है या नहीं, जब आप jquery का उपयोग करके फ़ॉर्म सबमिट करते हैं तो आपकी फ़ाइल की जांच करने का दूसरा तरीका नहीं है।
अदनान लिमडीवाला

@JoshBurgess ओपी पूछ रहा है कि यह jQuery में कैसे करें। अन्य सभी उत्तर या तो वेनिला JS या JS और jQuery के कॉम्बो का उपयोग करते हैं। यह केवल वही है जो विशेष रूप से jQuery का उपयोग करता है। शायद मैं पिकी हूं, लेकिन मुझे वैनिला जेएस के साथ jQuery का मिश्रण करना पसंद नहीं है जब तक कि मुझे वास्तव में नहीं करना है।
एडुआर्ड लुका

@EduardLuca जवाब दो साल से अधिक पुराना है। इसे उस समय निम्न गुणवत्ता के रूप में चिह्नित किया गया था। कोड की व्याख्या को आमतौर पर SO समुदाय द्वारा सराहा जाता है, और टिप्पणी का अर्थ केवल पोस्ट कोड को नहीं बल्कि कोड क्या है और यह क्यों काम करता है, यह बताने के लिए एक सहायक अनुस्मारक के रूप में था। आशा है कि स्पष्ट चीजों में मदद करता है।
जोश बर्गेस

3

मुझे पता है कि मुझे पार्टी में देर हो रही है, लेकिन मुझे लगा कि मैं इसके लिए उपयोग कर समाप्त कर दूंगा - जो कि केवल यह जांचना है कि फ़ाइल अपलोड इनपुट में ऑपरेटर और JQuery जैसे नहीं के साथ एक सत्य मान नहीं है:

if (!$('#videoUploadFile').val()) {
  alert('Please Upload File');
}

ध्यान दें कि यदि यह एक फॉर्म में है, तो आप फ़ॉर्म को सबमिट करने से रोकने के लिए इसे निम्न हैंडलर से लपेटना चाह सकते हैं:

$(document).on("click", ":submit", function (e) {

  if (!$('#videoUploadFile').val()) {
  e.preventDefault();
  alert('Please Upload File');
  }

}
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.