dropzone لا يعمل

Abdo Saad · 24 فبراير 2023

عند استخدام الدروب زون يظهر رساله الخطاء

upload.js:7 Uncaught ReferenceError: Dropzone is not defined
(upload.js:7:5)

شرف الدين حفني · 24 فبراير 2023

بتاريخ 7 دقائق مضت قال Abdo Saad:

عند استخدام الدروب زون يظهر رساله الخطاء

upload.js:7 Uncaught ReferenceError: Dropzone is not defined
(upload.js:7:5)

upload.js 834 B · 0 تنزيلات

أولًا في ملف upload.js لقد كتبت في اول سطر

ropzone.autoDiscover = false;

بدلًا من

Dropzone.autoDiscover = false;

ثانيًا :

يُرجى التأكد من أنك قمت بإستدعاء سكريبت dropzone قبل upload.js بمعنى أن يكون إستدعاء الإسكريبتات في صفحة الhtml لديك بهذا الشكل

<script src="https://unpkg.com/dropzone@5/dist/min/dropzone.min.js"></script>
<script src="./upload.js"></script>

كما تلاحظ الاسكريبت الذي يستدعي upload.js تم وضعه بعد dropzone وليس قبله

Mustafa Suleiman · 25 فبراير 2023

الخطأ الموجود في ملف upload.js يحدث بسبب عدم العثور على الكائن Dropzone، وهو غالبًا يعني عدم تحميل المكتبة المطلوبة بشكل صحيح. يجب التأكد من أن تم تضمين مكتبة Dropzone بشكل صحيح قبل استخدامها.

يمكن حل هذا الخطأ بتأكد من تضمين مكتبة Dropzone بشكل صحيح في صفحة HTML الخاصة بالتطبيق. يمكنك استخدام CDN لتحميل مكتبة Dropzone من الإنترنت أو تضمين الملفات المطلوبة محليًا إذا كانت موجودة بالفعل في المشروع.

وإليك مثال.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>My Upload Page</title>
    <!-- قم بتضمين Dropzone CSS -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/dropzone.min.css" />
</head>
<body>
    <h1>Upload Your Files Here</h1>
    <form action="/upload" class="dropzone"></form>
    <!-- قم بتضمين Dropzone JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.js"></script>
<script src="./upload.js"></script>
</body>
</html>

في هذا المثال، يتم تضمين مكتبة Dropzone باستخدام CDN عن طريق وضع روابط CSS و JS في الصفحة HTML.

        Dropzone.autoDiscover = false;
        const myDropzone = new Dropzone('.dropzone', {
            url: '/upload',
            success: function(file, response) {
                console.log('Upload success', response);
            },
            error: function(file, response) {
                console.error('Upload error', response);
            }
        });

يتم استخدام الأمر Dropzone.autoDiscover = false; لمنع Dropzone من البحث عن عناصر HTML التي يمكن تحويلها إلى مناطق إسقاط، ويتم إنشاء منطقة الإسقاط باستخدام الفئة .dropzone في عنصر النموذج. يتم تعيين مسار العمل المطلوب للإرسال إلى الخادم في خاصية url. يمكن تحديد مزيد من الإعدادات والخيارات لـ Dropzone باستخدام خيارات التكوين المختلفة.

للمزيد:

dropzone لا يعمل

السؤال

Abdo Saad

2 أجوبة على هذا السؤال

Recommended Posts

شرف الدين حفني

Mustafa Suleiman

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية