maxFileSize और acceptFileTypes को ब्लिंप फाइल अपलोड प्लगइन में काम नहीं आता है। क्यों?

85

मैं अपलोड फ़ाइलों के लिए Blueimp jQuery फ़ाइल अपलोड प्लगइन का उपयोग कर रहा हूं।

मुझे अपलोड करने में कोई समस्या नहीं थी लेकिन विकल्प maxFileSizeऔर acceptFileTypesकाम नहीं करता।

यह मेरा कोड है:

$(document).ready(function () {
    'use strict';

    $('#fileupload').fileupload({
        dataType: 'json',
        autoUpload: false,
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
        maxFileSize: 5000000,
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
                $('<p style="color: green;">' + file.name + '<i class="elusive-ok" style="padding-left:10px;"/> - Type: ' + file.type + ' - Size: ' + file.size + ' byte</p>')
                    .appendTo('#div_files');
            });
        },
        fail: function (e, data) {
            $.each(data.messages, function (index, error) {
                $('<p style="color: red;">Upload file error: ' + error + '<i class="elusive-remove" style="padding-left:10px;"/></p>')
                    .appendTo('#div_files');
            });
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);

            $('#progress .bar').css('width', progress + '%');
        }
    });
});
javascript  jquery  file-upload  blueimp  jquery-file-upload 
— YoBre
स्रोत
नमस्ते वहाँ, मैं फ़ाइल अपलोड के लिए इस कोड को लागू करने की कोशिश कर रहा हूं, लेकिन त्रुटि है कि अपलोड फ़ाइल त्रुटि कहते हैं: अपलोड बाइट्स फ़ाइल आकार से अधिक है क्या आप कृपया सुझाव दे सकते हैं कि क्या कारण है?
— जे महारजन
2
@JayMaharjan क्या आप सुनिश्चित हैं कि maxFileSize ठीक से कॉन्फ़िगर किया गया है?
— योएबरे
1
Php.ini में उचित कॉन्फ़िगरेशन करने के बाद अब मैं बड़ी फ़ाइलों को अपलोड करने में सक्षम हूं। आपके सहयोग के लिए धन्यवाद। :)
— जे महाराजन
मेरे मामले के लिए, gif को आकार दिया जा रहा था और png में बदल दिया गया था, और फिर gif के लिए फ़िल्टर स्पष्ट रूप से विफल हो गया। और अजीब तरह से, यह अपने आप काम करना शुरू कर दिया जैसे ही मुझे पता चला कि क्या चल रहा है, मैंने चेक किया कि क्या मैंने लाइब्रेरी के साथ कुछ किया है, लेकिन कुछ भी नहीं, मैंने जो कुछ रखा था वह कंसोल लॉग्स था, जिसे मैंने हटा दिया और अभी भी काम कर रहा हूं। ऐसा पोस्ट करने से किसी की मदद हो सकती है।
— ज़िया उल रहमान मुग़ल

जवाबों:

135

एक ही समस्या थी, और ब्लिंप वाले आदमी का कहना है कि " maxFileSize और acceptFileTypes केवल UI संस्करण द्वारा समर्थित हैं " और _validate और _hasError विधियों को शामिल करने के लिए (टूटा हुआ) लिंक प्रदान किया है।

इसलिए बिना यह जाने कि स्क्रिप्ट को गड़बड़ाने के बिना उन तरीकों को कैसे शामिल किया जाए, मैंने यह छोटा फ़ंक्शन लिखा था। ऐसा लगता है यह मेरे लिए काम का होगा।

बस इसे जोड़ें

add: function(e, data) {
        var uploadErrors = [];
        var acceptFileTypes = /^image\/(gif|jpe?g|png)$/i;
        if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
            uploadErrors.push('Not an accepted file type');
        }
        if(data.originalFiles[0]['size'].length && data.originalFiles[0]['size'] > 5000000) {
            uploadErrors.push('Filesize is too big');
        }
        if(uploadErrors.length > 0) {
            alert(uploadErrors.join("\n"));
        } else {
            data.submit();
        }
},

यहां आपके कोड में दिखाए गए अनुसार .fileupload विकल्प के शुरू में

$(document).ready(function () {
    'use strict';

    $('#fileupload').fileupload({
        add: function(e, data) {
                var uploadErrors = [];
                var acceptFileTypes = /^image\/(gif|jpe?g|png)$/i;
                if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
                    uploadErrors.push('Not an accepted file type');
                }
                if(data.originalFiles[0]['size'].length && data.originalFiles[0]['size'] > 5000000) {
                    uploadErrors.push('Filesize is too big');
                }
                if(uploadErrors.length > 0) {
                    alert(uploadErrors.join("\n"));
                } else {
                    data.submit();
                }
        },
        dataType: 'json',
        autoUpload: false,
        // acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
        // maxFileSize: 5000000,
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
                $('<p style="color: green;">' + file.name + '<i class="elusive-ok" style="padding-left:10px;"/> - Type: ' + file.type + ' - Size: ' + file.size + ' byte</p>')
                .appendTo('#div_files');
            });
        },
        fail: function (e, data) {
            $.each(data.messages, function (index, error) {
                $('<p style="color: red;">Upload file error: ' + error + '<i class="elusive-remove" style="padding-left:10px;"/></p>')
                .appendTo('#div_files');
            });
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);

            $('#progress .bar').css('width', progress + '%');
        }
    });
});

आपको लगता है कि मैंने वहाँ एक filesize फ़ंक्शन जोड़ा है क्योंकि यह भी केवल UI संस्करण में काम करेगा।

@Lopsered द्वारा सुझाए गए पिछले अंक प्राप्त करने के लिए अपडेट किया गया: जोड़े गए data.originalFiles[0]['type'].lengthऔर data.originalFiles[0]['size'].lengthप्रश्नों में यह सुनिश्चित करने के लिए कि वे मौजूद हैं और त्रुटियों के लिए परीक्षण से पहले खाली नहीं हैं। यदि वे मौजूद नहीं हैं, तो कोई त्रुटि नहीं दिखाई जाएगी और यह केवल आपके सर्वर साइड त्रुटि परीक्षण पर निर्भर करेगा।

— PaulMrG
स्रोत
यह वास्तव में उपयोगी है। हालांकि यह ध्यान दिया जाना चाहिए कि data.originalFiles[0]['type']फ़ाइल एपीआई का समर्थन नहीं करने वाले ब्राउज़र से अपलोड करते समय खाली है। मेरे एंड्रॉइड फोन पर ऐसा ही था। मैंने क्या किया था अगर यह मान उपलब्ध नहीं है और फिर सर्वर-साइड माइम प्रकार सत्यापन के लिए वापसी। अन्यथा आप कभी भी acceptFileTypes.testलाइन में नहीं
— पड़ते
@ लंबित है जो विषम है, मुझे अपने Android फ़ोन पर data.originalFiles [0] ['प्रकार'] और ['आकार'] का मान मिलता है और यह दोनों परीक्षण पास करता है। मुझे वास्तव में अपने फोन से परेशानी हो रही है जहाँ सब कुछ बिना त्रुटि के काम करने लगता है लेकिन फ़ाइल अपलोड नहीं होती है। कहीं और कोई समस्या नहीं, बस Android।
— पॉलमर्ग
8
मुझे लगता है कि हालत 'data.originalFiles [0] [' size '] है। लंबाई' पदावनत है इसलिए यह गलत है।
— kkocabiyik 20
5
Data.files का उपयोग करें [0] ['आकार'] और data.files [0] ['प्रकार']
— Jose
2
बिना 'लंबाई' (data.originalFiles [0] ['size'] और& data.originalFiles [0] ['size']> 500000) का उपयोग किए बिना? 'सत्य': 'असत्य' ठीक काम करता है, लेकिन मैं जानना चाहता हूं कि क्या मुझे कोई परिदृश्य याद आ रहा है 1. data.originalFiles [0] ['आकार']? 'सत्य': 'असत्य' (1) मूल्यों के लिए असत्य 0, अशक्त, अपरिभाषित
— लौटाता है
49

इसमें कार्य करने के लिए आपको jquery.fileupload-process.js और jquery.fileupload-validate.js शामिल करने चाहिए।

— lboullo0
स्रोत
4
यह बेहतर जवाब लगता है। ;)
— थैस्मो
8
त्रुटि संदेश प्राप्त करने के लिए आपके द्वारा स्क्रिप्ट को लोड करने का क्रम महत्वपूर्ण है: tmpl.min.js> jquery.ui.widget.js> jquery.iframe-transport.js> jquery.fileupload.js> jquery.fileupload-ui.js>। jquery.fileupload-process.js> jquery.fileupload-validate.js
— a11r
3
समस्या वही है, क्या आप कृपया कुछ कार्य उदाहरण प्रदान कर सकते हैं?
— व्लातको
3
मुझे भी यही समस्या आ रही है। मेरी जेएस फाइलें वर्णित सटीक क्रम में हैं, फिर भी मैं अभी भी उन फ़ाइलों को अपलोड करने में सक्षम हूं जो दोनों रेगेक्स के अनुसार स्वीकार नहीं किए जाते हैं, लेकिन फ़ाइल आकार सीमा पर भी बड़े पैमाने पर हैं। मैं नवीनतम FileUpload संस्करण का उपयोग कर रहा हूं, 9.10.5 jQuery के साथ 1.11.1
— श्री पाब्लो
3
सही क्रम में शामिल सभी लिपियों के साथ भी, मेरे लिए काम नहीं करता है।
— बैडहोरसी
10

जैसा कि पहले उत्तर में सुझाव दिया गया था, हमें दो अतिरिक्त फ़ाइलों को शामिल करने की आवश्यकता है - jquery.fileupload-process.jsऔर फिर jquery.fileupload-validate.jsहालाँकि मुझे एक फ़ाइल जोड़ते समय कुछ अतिरिक्त अजाक्स कॉल करने की आवश्यकता है, मैं fileuploadaddउन कॉल करने के लिए घटना की सदस्यता ले रहा हूं । इस तरह के उपयोग के बारे में इस प्लगइन के लेखक ने निम्नलिखित सुझाव दिए

कृपया यहाँ देखें: https://github.com/blueimp/jQuery-File-Upload/wiki/Options#wiki-callback-options

बाइंड (या jQuery 1.7+ के साथ विधि पर) के माध्यम से अतिरिक्त ईवेंट श्रोताओं को जोड़ना jQuery फ़ाइल अपलोड यूआई संस्करण द्वारा कॉलबैक सेटिंग्स को संरक्षित करने का पसंदीदा विकल्प है।

वैकल्पिक रूप से, आप अपने स्वयं के कॉलबैक में भी प्रोसेसिंग शुरू कर सकते हैं, जैसे: https://github.com/blueimp/jQuery-File-Upload/blob/master/js/jquery.fileupload-process.js#L50

दो सुझाए गए विकल्पों के संयोजन का उपयोग करते हुए, निम्नलिखित कोड मेरे लिए पूरी तरह से काम करता है

$fileInput.fileupload({
    url: 'upload_url',
    type: 'POST',
    dataType: 'json',
    autoUpload: false,
    disableValidation: false,
    maxFileSize: 1024 * 1024,
    messages: {
        maxFileSize: 'File exceeds maximum allowed size of 1MB',
    }
});

$fileInput.on('fileuploadadd', function(evt, data) {
    var $this = $(this);
    var validation = data.process(function () {
        return $this.fileupload('process', data);
    });

    validation.done(function() {
        makeAjaxCall('some_other_url', { fileName: data.files[0].name, fileSizeInBytes: data.files[0].size })
            .done(function(resp) {
                data.formData = data.formData || {};
                data.formData.someData = resp.SomeData;
                data.submit();
        });
    });
    validation.fail(function(data) {
        console.log('Upload error: ' + data.files[0].error);
    });
});
— अमिथ जॉर्ज
स्रोत
1
अमिथ, मैंने यह कोशिश की और निम्नलिखित त्रुटि मिली:Uncaught Error: cannot call methods on fileupload prior to initialization; attempted to call method 'process'
— TheVillageIdiot
1
यह लगभग हमेशा इसका मतलब है कि .fileupload()उचित समय पर नहीं बुलाया गया था। कोड देखे बिना, इसका निदान करना लगभग असंभव है। मेरा सुझाव है कि एक नया प्रश्न खोलना और संबंधित कोड को पोस्ट करना, शायद एक jsfiddle के रूप में।
— अमिथ जॉर्ज
@ TheVillageIdiot क्या आप $ fileInput.fileupload घोषणा के अंदर 'fileuploadadd' के लिए तर्क स्थापित करने की कोशिश कर रहे हैं? जब मैंने अमिथ के उदाहरण को कुछ इस तरह से मोड़ने की कोशिश की तो मुझे भी ऐसी ही त्रुटि हुई: $('#fileupload').fileupload({ blah : blah, blah : blah, }) $fileInput.on('fileuploadadd', function(evt, data) { var $this = $(this); var validation = data.process(function () { return $this.fileupload('process', data); }); ... जब मैंने इसके बारे में सोचा था तो यह स्पष्ट था, लेकिन मैं कुछ के अंदर तर्क को परिभाषित करने की कोशिश कर रहा था जिसे मैंने अभी तक घोषित नहीं किया था।
— jdhurst
मुझे यह त्रुटि मिल रही है: अनट्रेडेड संदर्भरूट: मेकअजैक्सकॉल
— मुख्तार
8

यह मेरे लिए फ़ायरफ़ॉक्स में काम करता है

$('#fileupload').fileupload({

    dataType: 'json',
    //acceptFileTypes: /(\.|\/)(xml|pdf)$/i,
    //maxFileSize: 15000000,

    add: function (e, data) {
        var uploadErrors = [];

        var acceptFileTypes = /\/(pdf|xml)$/i;
        if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
            uploadErrors.push('File type not accepted');
        }

        console.log(data.originalFiles[0]['size']) ;
        if (data.originalFiles[0]['size'] > 5000000) {
            uploadErrors.push('Filesize too big');
        }
        if(uploadErrors.length > 0) {
            alert(uploadErrors.join("\n"));
        } else {
            data.context = $('<p/>').text('Uploading...').appendTo(document.body);
            data.submit();
        }

    },
    done: function (e, data) {
        data.context.text('Success!.');
    }
});
— nasatome
स्रोत
3
ढेर अतिप्रवाह में आपका स्वागत है! क्या आप कृपया इस उत्तर को फिर से लिख सकते हैं ताकि यह अंग्रेजी में हो? मुझे पता है कि स्वचालित अनुवादक कभी-कभी यह बताना मुश्किल कर सकते हैं, लेकिन अंग्रेजी केवल (गैर-प्रोग्रामिंग) भाषा है जो हम यहां उपयोग करते हैं।
— पॉप्स
15
ध्यान रहे, आपको यह समझने में सक्षम होने के लिए चालाक भाषाविद् होने की ज़रूरत नहीं है कि नासाटॉम कह रहा है "यह मेरे लिए काम करता है: यह फ़ायरफ़ॉक्स में सही है।" अपलोड त्रुटि "फ़ाइल का आकार बहुत बड़ा है"। मैं ऑस्ट्रेलियाई हूं और मैं अंग्रेजी बोलना बड़ा हुआ हूं, लेकिन मुझे लगता है कि एक निश्चित अंग्रेजी बोलने वाला रवैया है। "अंग्रेजी एकमात्र ऐसी भाषा है जिसका हम यहां उपयोग करते हैं" यह सच नहीं है। यहां के लोग कई अलग-अलग भाषाओं का उपयोग करते हैं। हालाँकि इस साइट की नीति अंग्रेजी में प्रश्न और उत्तर देना है।
— टिम ओगिल्वी
3

"jquery.fileupload-ui.js" नाम की फ़ाइल खोलें, आपको इस तरह कोड दिखाई देगा:

 $.widget('blueimp.fileupload', $.blueimp.fileupload, {

    options: {
        // By default, files added to the widget are uploaded as soon
        // as the user clicks on the start buttons. To enable automatic
        // uploads, set the following option to true:
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
        autoUpload: false,
        // The ID of the upload template:
        uploadTemplateId: 'template-upload',
        // The ID of the download template:
        downloadTemplateId: 'template-download',
        。。。。

बस एक पंक्ति कोड जोड़ें --- नया गुण "acceptFileTypes", इस तरह:

 options: {
        // By default, files added to the widget are uploaded as soon
        // as the user clicks on the start buttons. To enable automatic
        // uploads, set the following option to true:
        **acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,**
        autoUpload: false,
        // The ID of the upload template:
        uploadTemplateId: 'template-upload',
        // The ID of the download template:
        downloadTemplateId: 'template-d

अब आप देखेंगे कि सब कुछ ठीक है! ~ आप सिर्फ एक गलत जगह के साथ विशेषता लेते हैं।

— डुआन
स्रोत
यदि आप इसे मदद कर सकते हैं तो किसी प्लगइन / लाइब्रेरी के मुख्य कोड को संशोधित करना एक बुरा विचार है।
— बैडहोरसी
3

यदि आपको जेएस के आयातित और सही क्रम में सभी प्लगइन मिल गए हैं, लेकिन आप अभी भी समस्याएँ हैं, तो ऐसा लगता है कि अपने स्वयं के "ऐड" को निर्दिष्ट करने के लिए हैंडलर nerfs को * -validate.js प्लगइन से निर्दिष्ट करता है, जो सामान्य रूप से फायर होता है। data.process () कॉल करके सभी सत्यापन बंद करें। तो इसे ठीक करने के लिए अपने "ऐड" इवेंट हैंडलर में ऐसा कुछ करें:

$('#whatever').fileupload({
...
add: function(e, data) {
   var $this = $(this);
   data.process(function() {
      return $this.fileupload('process', data);
   }).done(function(){
      //do success stuff
      data.submit(); <-- fire off the upload to the server
   }).fail(function() {
      alert(data.files[0].error);
   });
}
...
});
— bigwig87
स्रोत
मेरा मुद्दा हल किया
— fezfox
2

के लिए जाँच / मान्य उदाहरण:

  • एकाधिक फ़ाइल इनपुट
  • एक या एकाधिक फ़ाइलें अपलोड के लिए -$.grep()त्रुटियों के साथ सरणी से फ़ाइलों को निकालने के लिए
  • image तथा audio प्रारूप
  • स्ट्रिंग से गतिशील फ़ाइल प्रकार new RegExp()

सूचना: acceptFileTypes.test()- माइम के प्रकारों की जांच करें, जैसे एडियो फाइल के लिए .mp3यह होगा audio/mpeg- न केवल विलोपन। सभी ब्लिंप विकल्पों के लिए: https://github.com/blueimp/jQuery-File-Upload/wiki/Options

$('input[type="file"]').each(function(i){

    // .form_files is my div/section of form for input file and progressbar
    var $progressbar = $(this).parents('.form_files:first').find('.progress-bar:first');

    var $image_format = 'jpg|jpeg|jpe|png|gif';
    var $audio_format = 'mp3|mpeg';
    var $all_formats = $image_format + '|' + $audio_format;

    var $image_size = 2;
    var $audio_size = 10;
    var mb = 1048576;

    $(this).fileupload({
        // ...
        singleFileUploads: false,   // << send all together, not single
        // ...
        add: function (e, data) {

            // array with all indexes of files with errors
            var error_uploads_indexes = [];

            // when add file - each file
            $.each(data.files, function(index, file) {

                // array for all errors
                var uploadErrors = [];


                // validate all formats first
                if($all_formats){

                    // check all formats first - before size
                    var acceptFileTypes = "(\.|\/)(" + $all_formats + ")$";
                    acceptFileTypes = new RegExp(acceptFileTypes, "i");

                    // when wrong format
                    if(data.files[index]['type'].length && !acceptFileTypes.test(data.files[index]['type'])) {
                        uploadErrors.push('Not an accepted file type');

                    }else{

                        // default size is image_size
                        var $my_size = $image_size;

                            // check audio format
                            var acceptFileTypes = "(\.|\/)(" + $audio_format + ")$";
                            acceptFileTypes = new RegExp(acceptFileTypes, "i");

                            // alert(data.files[index]['type']);
                            // alert(acceptFileTypes.test('audio/mpeg'));

                            // if is audio then size is audio_size
                            if(data.files[index]['type'].length && acceptFileTypes.test(data.files[index]['type'])) {
                                $my_size = $audio_size;
                            }

                        // check size
                        if(data.files[index]['size'] > $my_size * mb) {
                            uploadErrors.push('Filesize is too big');
                        };
                    };

                }; // << all_formats

                // when errors
                if(uploadErrors.length > 0) {
                    //  alert(uploadErrors.join("\n"));

                    // mark index of error file
                    error_uploads_indexes.push(index);
                    // alert error
                    alert(uploadErrors.join("\n"));

                };

            }); // << each


            // remove indexes (files) with error
            data.files = $.grep( data.files, function( n, i ) {
                return $.inArray(i, error_uploads_indexes) ==-1;
            });


            // if are files to upload
            if(data.files.length){
                // upload by ajax
                var jqXHR = data.submit().done(function (result, textStatus, jqXHR) {
                        //...
                     alert('done!') ;
                        // ...
                });
            } // 

        }, // << add
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $progressbar.css(
                'width',
                progress + '%'
                );
        }
    }); // << file_upload

    //          
}); // << each input file
— लगुना वेब डिज़ाइन
स्रोत
1

ऐड इवेंट के लिए इवेंट हैंडलर का सिर्फ एक उदाहरण। मान लेता है कि सिंगलफाइल लोड का विकल्प सक्षम है (जो कि डिफ़ॉल्ट है)। Add / fileuploadadd ईवेंट के साथ बाध्य होने के लिए और jQuery फ़ाइल अपलोड प्रलेखन पढ़ें। लूप के अंदर आप इस या फाइल दोनों वर्जन का उपयोग कर सकते हैं । आकार संपत्ति प्राप्त करने का एक उदाहरण: यह ['आकार'] या file.size ।

    /**
     * Handles Add event
     */
    base.eventAdd = function(e, data) {

        var errs = [];
        var acceptFileTypes = /(\.|\/)(gif|jpe?g|png)$/i;
        var maxFileSize = 5000000;

        // Validate file
        $.each(data.files, function(index, file) {
            if (file.type.length && !acceptFileTypes.test(file.type)) {
                errs.push('Selected file "' + file.name + '" is not alloawed. Invalid file type.');
            }
            if (this['size'] > maxFileSize) {
                errs.push('Selected file "' + file.name + '" is too big, ' + parseInt(file.size / 1024 / 1024) + 'M.. File should be smaller than ' + parseInt(maxFileSize / 1024 / 1024) + 'M.');
            }
        });

        // Output errors or submit data
        if (errs.length > 0) {
            alert('An error occured. ' + errs.join(" "));
        } else {
            data.submit();
        }
    };
— दाह
स्रोत
1

यह मेरे लिए chrome, jquery.fileupload.js संस्करण में 5.42.3 है

     add: function(e, data) {
        var uploadErrors = [];
        var ext = data.originalFiles[0].name.split('.').pop().toLowerCase();
        if($.inArray(ext, ['odt','docx']) == -1) {
            uploadErrors.push('Not an accepted file type');
        }
        if(data.originalFiles[0].size > (2*1024*1024)) {//2 MB
            uploadErrors.push('Filesize is too big');
        }
        if(uploadErrors.length > 0) {
            alert(uploadErrors.join("\n"));
        } else {
            data.submit();
        }
    },
— राजेंद्र थोराट
स्रोत
1
धन्यवाद। 9.21 पर भी काम करता है।
— geca
1 
.fileupload({
    add: function (e, data) { 
        var attachmentValue = 3 * 1000 * 1024;
        var totalNoOfFiles = data.originalFiles.length;
        for (i = 0; i < data.originalFiles.length; i++) {
            if (data.originalFiles[i]['size'] > attachmentValue) {
                $attachmentsList.find('.uploading').remove();
                $attachmentMessage.append("<li>" + 'Uploaded bytes exceeded the file size' + "</li>");
                $attachmentMessage.show().fadeOut(10000, function () {
                    $attachmentMessage.html('');
                });
                data.originalFiles.splice(i, 1);
            }
        }
        if (data.files[0]) {
            $attachmentsList
           .prepend('<li class="uploading" class="clearfix loading-content">' + data.files[0].name + '</li>');
        }
        data.submit();                    
    }
— वैभव एम नलवाड़
स्रोत
1

मामले में किसी को भी सर्वर द्वारा आमतौर पर समर्थित स्वरूपों की तलाश में

3g2|3gp|3gp2|3gpp|aac|aaf|aca|accdb|accde|accdt|acx|adt|adts|afm|ai|aif|aifc|aiff|appcache|application|art|asd|asf|asi|asm|asr|asx|atom|au|avi|axs|bas|bcpio|bin|bmp|c|cab|calx|cat|cdf|chm|class|clp|cmx|cnf|cod|cpio|cpp|crd|crl|crt|csh|css|csv|cur|dcr|deploy|der|dib|dir|disco|dll|dllconfig|dlm|doc|docm|docx|dot|dotm|dotx|dsp|dtd|dvi|dvr-ms|dwf|dwp|dxr|eml|emz|eot|eps|esd|etx|evy|exe|execonfig|fdf|fif|fla|flr|flv|gif|gtar|gz|h|hdf|hdml|hhc|hhk|hhp|hlp|hqx|hta|htc|htm|html|htt|hxt|ico|ics|ief|iii|inf|ins|isp|IVF|jar|java|jck|jcz|jfif|jpb|jpe|jpeg|jpg|js|json|jsonld|jsx|latex|less|lit|lpk|lsf|lsx|lzh|m13|m14|m1v|m2ts|m3u|m4a|m4v|man|manifest|map|mdb|mdp|me|mht|mhtml|mid|midi|mix|mmf|mno|mny|mov|movie|mp2|mp3|mp4|mp4v|mpa|mpe|mpeg|mpg|mpp|mpv2|ms|msi|mso|mvb|mvc|nc|nsc|nws|ocx|oda|odc|ods|oga|ogg|ogv|one|onea|onepkg|onetmp|onetoc|onetoc2|osdx|otf|p10|p12|p7b|p7c|p7m|p7r|p7s|pbm|pcx|pcz|pdf|pfb|pfm|pfx|pgm|pko|pma|pmc|pml|pmr|pmw|png|pnm|pnz|pot|potm|potx|ppam|ppm|pps|ppsm|ppsx|ppt|pptm|pptx|prf|prm|prx|ps|psd|psm|psp|pub|qt|qtl|qxd|ra|ram|rar|ras|rf|rgb|rm|rmi|roff|rpm|rtf|rtx|scd|sct|sea|setpay|setreg|sgml|sh|shar|sit|sldm|sldx|smd|smi|smx|smz|snd|snp|spc|spl|spx|src|ssm|sst|stl|sv4cpio|sv4crc|svg|svgz|swf|t|tar|tcl|tex|texi|texinfo|tgz|thmx|thn|tif|tiff|toc|tr|trm|ts|tsv|ttf|tts|txt|u32|uls|ustar|vbs|vcf|vcs|vdx|vml|vsd|vss|vst|vsto|vsw|vsx|vtx|wav|wax|wbmp|wcm|wdb|webm|wks|wm|wma|wmd|wmf|wml|wmlc|wmls|wmlsc|wmp|wmv|wmx|wmz|woff|woff2|wps|wri|wrl|wrz|wsdl|wtv|wvx|x|xaf|xaml|xap|xbap|xbm|xdr|xht|xhtml|xla|xlam|xlc|xlm|xls|xlsb|xlsm|xlsx|xlt|xltm|xltx|xlw|xml|xof|xpm|xps|xsd|xsf|xsl|xslt|xsn|xtp|xwd|z|zip
— अरुण प्रसाद ई.एस.
स्रोत
0

आप एक अतिरिक्त फ़ंक्शन का उपयोग भी कर सकते हैं जैसे:

    function checkFileType(filename, typeRegEx) {
        if (filename.length < 4 || typeRegEx.length < 1) return false;
        var filenameParts = filename.split('.');
        if (filenameParts.length < 2) return false;
        var fileExtension = filenameParts[filenameParts.length - 1];
        return typeRegEx.test('.' + fileExtension);
    }
— developer10214
स्रोत
0

आपको jquery.fileupload-process.js और jquery.fileupload-validate.js शामिल करना चाहिएइसमें कार्य करने के लिए करने चाहिए।

फिर...

$(this).fileupload({
    // ...
    processfail: function (e, data) {
        data.files.forEach(function(file){
            if (file.error) {
                self.$errorMessage.html(file.error);
                return false;
            }
        });
    },
//...
}

प्रॉसेसफेल कॉलबैक एक सत्यापन विफल होने के बाद लॉन्च किया गया है।

— danielsan80
स्रोत
0
  • आप फ़ाइल एक्सटेंशन के लिए फ़ाइल एक्सटेंशन का उपयोग कर सकते हैं।

  • अधिक सरल तरीका कुछ करना होगा जैसा कि नीचे दिए गए ऐड में दिया गया है:

    add : function (e,data){
   var extension = data.originalFiles[0].name.substr( 
   (data.originalFiles[0].name.lastIndexOf('.') +1) );
            switch(extension){
                case 'csv':
                case 'xls':
                case 'xlsx':
                    data.url = <Your URL>; 
                    data.submit();
                break;
                default:
                    alert("File type not accepted");
                break;
            }
  }
— श्रीलक्ष्मी अय्यर
स्रोत
0

यदि आपके पास एक से अधिक फ़ाइल हैं, तो आप प्रत्येक फ़ाइल प्रारूप को सत्यापित करने के लिए एक लूप का उपयोग करते हैं, कुछ इस तरह से

add: function(e, data) {
        data.url = 'xx/';
        var uploadErrors = [];
         var acceptFileTypes = /^image\/(gif|jpe?g|png)$/i;
        console.log(data.originalFiles);
        for (var i = 0; i < data.originalFiles.length; i++) {
            if(data.originalFiles[i]['type'].length && !acceptFileTypes.test(data.originalFiles[i]['type'])) {
                    uploadErrors.push('Not an accepted file type');
                    data.originalFiles
                }
                if(data.originalFiles[i]['size'].length && data.originalFiles[i]['size'] > 5000000) {
                    uploadErrors.push('Filesize is too big');
                }
                if(uploadErrors.length > 0) {

                      alert(uploadErrors.join("\n"));
                }
        }
        data.submit();
      },
— मनीष एस
स्रोत
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.