如果表单字段与数据库结果匹配,则上载文件 - DropzoneJS

时间:2017-06-06 20:55:49

标签: javascript php jquery html dropzone.js

我今天在这里发帖讲述涉及DropzoneJS和PHP的问题。

我需要什么:

  • 要在提交时上传的文件
  • 与其他表单字段一起提交的表单
  • 仅当特定表单字段与数据库结果匹配时才上载的文件

现在,即使我使用autoProcessQueue: false,,文件也会立即上传到页面上。我需要在提交时上传文件,我已经在Stack Exchange上查看了几个示例和相关问题但无济于事。下面我列出了我的缩小版本。任何帮助深表感谢。谢谢。请帮忙。

悬浮窗-的index.php:

<form id="uploadform" class="dropzone" action="dropzone-upload.php" method="POST" enctype="multipart/form-data">
    <input type="email" id="emailto" name="emailto" value="something@something.com">
    <input type="email" id="emailfrom" name="emailfrom" placeholder="Enter your email">
    <textarea name="message" id="message" placeholder="Message to the receiver"></textarea>
    <div class="dropzone-previews"></div>
    <button type="submit" class="btn btn-default">Submit</button>
</form>
<script type="text/javascript">
    $(document).ready(function(){   
        function validateEmail(email) {
            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
            return re.test(email);
        }
        Dropzone.autoDiscover = false;
        Dropzone.options.uploadForm = {
            acceptedFiles: "image/jpeg,image/jpg,image/png,image/gif,image/bmp,application/pdf",
            maxFilesize: 50,
            autoProcessQueue: false,
            uploadMultiple: true,
            parallelUploads: 5,
            maxFiles: 5,
            addRemoveLinks: true,
            previewsContainer: ".dropzone-previews",
            dictDefaultMessage: '',
            init: function() {
                var myDropzone=this;
                this.element.querySelector("button[type=submit]").addEventListener("click", function(e){
                    var email = $("#emailfrom").val();
                    if (validateEmail(email)) {
                        e.preventDefault();
                        e.stopPropagation();
                        myDropzone.processQueue();
                    }else{
                        $('#emailvalid').html('<input type=\"email\" class=\"form-control input-sm\" id=\"emailfrom\" name=\"emailfrom\" placeholder=\"Enter your email\" required style=\"border-color:red;\">');
                    }
                });
            }
        }
    });
</script>

悬浮窗-upload.php的

$emailfrom = strtolower(htmlspecialchars(strip_tags($_POST['emailfrom'])));
if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest' && !empty($_POST['emailfrom'])){
    $dbc = ...;
    $query = "SELECT...";
    $stmt = sqlsrv_query($dbc, $query);
    if ($stmt != null && sqlsrv_has_rows($stmt) === TRUE){
        $row = sqlsrv_fetch_array($stmt);
        if(strtolower($row['Email']) == $emailfrom){
            $ds = DIRECTORY_SEPARATOR;

            $storeFolder = 'uploads';
            $digits = '';

            $amountOfDigits = 4;
            $numbers = range(0,9);
            shuffle($numbers);

            for($i = 0;$i < $amountOfDigits;$i++){
               $digits .= $numbers[$i];
            }

            if (!empty($_FILES)) {
                var_dump($_FILES);
                $tempFile = $_FILES['file']['tmp_name'];

                $targetPath = dirname( __FILE__ ) . $ds . $storeFolder . $ds;

                $targetFile = $targetPath . time() . '-' . $digits . '-' . $_FILES['file']['name'];
                move_uploaded_file($tempFile, $targetFile);
            }
        }
    }
}

0 个答案:

没有答案