javascript - Dropzone js not working without form

How can I use dropzone without using the class in the form.

I basically want to have a div inside a form and call class="dropzone" in that div. But it doesn't seems to work.

Here is my code below:

<!DOCTYPE html>
<html lang="en">
    <head>
    <title></title>
    <link rel="stylesheet" href="css/basic.css" />
    <link rel="stylesheet" href="css/dropzone.css"/>
    <script src="dropzone.min.js"></script>
    <script type="text/javascript">
        var myDropzone = new Dropzone("div#myId", { url: "file-upload"})
    </script>

    <body>
        <form action="upload.php">
            <input type="text">
            <div id="myId" class="dropzone"></div>
        </form>
    </body>
</html>

How can I use dropzone without using the class in the form.

I basically want to have a div inside a form and call class="dropzone" in that div. But it doesn't seems to work.

Here is my code below:

<!DOCTYPE html>
<html lang="en">
    <head>
    <title></title>
    <link rel="stylesheet" href="css/basic.css" />
    <link rel="stylesheet" href="css/dropzone.css"/>
    <script src="dropzone.min.js"></script>
    <script type="text/javascript">
        var myDropzone = new Dropzone("div#myId", { url: "file-upload"})
    </script>

    <body>
        <form action="upload.php">
            <input type="text">
            <div id="myId" class="dropzone"></div>
        </form>
    </body>
</html>

Share edited Nov 14, 2013 at 21:06 tadman 212k23 gold badges236 silver badges265 bronze badges asked Apr 24, 2013 at 9:47 Ashish Prasad 231 gold badge1 silver badge4 bronze badges

Add a ment |

2 Answers 2

Sorted by: Reset to default 2

Initiate .ready event when DOM ready and use like this.

<!DOCTYPE html>
<html lang="en">
    <head>
    <title></title>
    <link rel="stylesheet" href="css/basic.css" />
    <link rel="stylesheet" href="css/dropzone.css"/>
    <script src="dropzone.min.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function() 
        {
            var myDropzone = new Dropzone("div#myId", { url: "file-upload"});
        });
    </script>

    <body>
        <form action="upload.php">
            <input type="text">
            <div id="myId" class="dropzone"></div>
        </form>
    </body>
</html>

your url parameter is not pointing to any valid php file. I believe your code should be thus

<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<link rel="stylesheet" href="css/basic.css" />
<link rel="stylesheet" href="css/dropzone.css"/>
<script src="dropzone.min.js"></script>
<script type="text/javascript">
    var myDropzone = new Dropzone("div#myId", { url: "upload.php"}) //according to your forms action
</script>

<body>
    <form action="upload.php">
        <input type="text">
        <div id="myId" class="dropzone"></div>
    </form>
</body>

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - Dropzone js not working without form - Stack Overflow

2 Answers 2

与本文相关的文章

评论列表(0)