All geek questions in one place

Enabled button when uploading to Dropzone

I create files to download with dropzonejs but I want

"if users do not upload and do not upload the file to proggres in the 2 form" photo "and" Documentation "the send button is still disabled ."

"if users have already completed uploading in 2 forms" photos "and" Documentation ", this button send the change is enabled "

This is my script

<html>
<head>   
    <link href="css/dropzone.css" type="text/css" rel="stylesheet" />
    <script src="js/dropzone.js"></script>
</head>

<body>
     <script>
        function submitform()
                        {
                            document.forms["form_upload"].submit();
                        }
     </script>
     <form action="send_data.php" id="mydata" name="mydata" method="POST" >
        Your Name   <input type="text" placeholder="Your Name" name="your_name">    
     </form>

        Your Photo  
    <form action="upload.php" method="POST" class="dropzone">
     <input name="folder" type="hidden" value="301">
     <input name="parameter" type="hidden" value="photo">
    </form>

        Your Documentation  
    <form action="upload.php" method="POST" class="dropzone">
     <input name="folder" type="hidden" value="301">
     <input name="parameter" type="hidden" value="documentation">
    </form>

    <center><button disabled="True"  onclick="javascript: submitform()" type="button">Submit</button></center>
</body>
</html>

this source code is dropzone.js and dropzone.css

Help me thank :)

+4
1

dropzone div dz-success, , , jQuery:

function checkForm() {
  var valid = true;
  if ($.trim($('input[name=your_name]').val()) === '') {
    valid = false;
  }
  $('form.dropzone').each(function() {
    if ($(this).find('.dz-success').length === 0) {
      valid = false;
    }
  });
  if (valid) {
    $('button[disabled=True]').removeAttr('disabled');
  }
};

dropzone , init, dropzone , false.

init :

- , Dropzone. .

success , :

. . ( )

Dropzone.autoDiscover = false;
$(".dropzone").each( function(){
    $(this).dropzone({
        init: function() {
            this.on("success", function() { 
                checkForm();
            });
        }
    });
});

, .

:

Complete , , .

Dropzone.autoDiscover = false;
$(".dropzone").each(function() {
  $(this).dropzone({
    complete: function(file) {
      if (file.status == "success") {
        checkForm();
      }
    }
  });
});

: http://www.dropzonejs.com/#configuration

, runnable:

http://code.runnable.com/VgWdDZgLJkUGaepA/dropzone-success-event-for-php

+3

Source: https://habr.com/ru/post/1608932/

More articles:


All Articles