使用ajax将多个文件上传到变量文件夹

时间:2016-01-13 00:06:22

标签: javascript php jquery ajax upload

我目前正在尝试制作一个表单,将多个文件上传到通过下拉列表选择的文件夹。到目前为止,我能够将一个文件上传到预定的文件夹(不是下拉列表),但在我最近的尝试中,我似乎无法弄清楚与ajax文件到php的通信有什么问题。有人能帮助我吗?目前代码只是刷新我的页面,并没有返回任何PHP结果。

我的表格:

<form  method="post" id="form" enctype="multipart/form-data" >
              <p>
                <input type="file" name="file" id="file" onclick="zero_damnit()" onchange="bars()"  multiple></input>
              </p>
          </div>
        </div>
      </div>
      <a class="bar_font">Files</a>
      <div class="progress_bar meter super_center nostripes">
        <span id="load" ></span>
      </div>
      <a class="bar_font">Size</a>
      <div class="progress_bar meter super_center nostripes">
        <span id="size"></span>
   <div class="dropdown_section">
            <a class="bar_font">Category</a>
            <select name="folder" id="drop_category">
              <option value="empty">empty</option>
              <option value="bass">bass</option>
              <option value="clap">clap</option>
              <option value="hi-hat">hi-hat</option>
              <option value="kick">kick</option>
              <option value="lead">lead</option>
              <option value="perc">perc</option>
              <option value="sfx">sfx</option>
              <option value="snare">snare</option>
              <option value="synth">synth</option>
              <option value="vocal">vocal</option>
              <option value="loop">loop</option>
              <option value="other">other</option>
            </select>
          <br>
            </div>
<!-- terms -->
        <div class="checkbox_upload" id="saber">
          <input type="checkbox" onclick="changeClass()"  name="terms" id="terms"> I accept the <a class="link-style" href="terms.html">Terms and Conditions.</a>
        </div>
        <div class="shift meterslim super_center nostripes">
        <span style="width: 50%"></span>
      </div>

      </div>
    </div>
        <div class='center super_center'>
          <input type="submit" name="submit" id="submit" class="button_before submit">
        </div>
        <div id="results">
        </div>
      </div>
</form>

PHP:

<?php
$folder = $_POST['folder'];
// sanitise $folder
$location = 'uploaded/' . rtrim($folder, '/') . '/' . $_FILES['file']['name'];
if(file_exists($location)) {
    echo 'File already exists';
}
else {
    move_uploaded_file($_FILES['file']['tmp_name'],  $location);
    echo true;
    echo 'File was stored in:' . $location;
}
?> 

的Ajax:

$('#submit').on('click', function() {
    var folder = $('input#drop_category').val();
    var file_data = $('#file').prop('files')[0];     
    var form_data = new FormData();                  
    form_data.append('files', file_data, 'folder',folder);
    alert(form_data);                             
    $.ajax({
                url: 'upload.php', // point to server-side PHP script 
                dataType: 'text',  // what to expect back from the PHP script, if anything
                cache: false,
                contentType: false,
                processData: false,
                data: form_data,                         
                type: 'post',
                success: function(php_script_response){
                    alert(php_script_response); // display response from the PHP script, if any
                }
     });
});

1 个答案:

答案 0 :(得分:0)

import Graphics.Element exposing (show)

main =
  map (show << toString) mergedSignal