duancaozen6066 2016-07-25 23:26
浏览 145

使用AJAX上传文件和$ _POST失败

I'm trying to upload a file and some text inside a textarea together using AJAX. I'm getting the following error in the PHP page that receives the data:

Notice: Undefined index: guion in file/path/here on line X

It means that the file is not being sent. Tried var_dump $_FILES and it output:

array(0) { }

HTML Code:

<div id="_AJAX_"></div>

<div role="form">
  <div id="fileGuionGroup" class="form-group">
    <label for="guion">Archivo Gui&oacute;n</label>
    <input id="fileGuion" type="file" name="guion">

  <div id="txtComentarioGroup" class="form-group">
    <label for="comentario">Comentario</label>
    <textarea id="txtComentario" class="form-control" name="comentario" rows="4" placeholder="Ejemplo: Solicito que por favor se monte este curso en plataforma."></textarea>

<button id="send_request" type="button" class="btn btn-primary btn-block" onclick="submitSolicitud(`{$cursoKey}`)"><i class="fa fa-fw fa-cogs"></i> Solicitar Montaje</button>

Javascript Code:

function submitSolicitud(cursoKey) {
  var fileGuion     = document.getElementById('fileGuion');
  var txtComentario = document.getElementById('txtComentario');

  var formGroupGuion      = document.getElementById('fileGuionGroup');
  var formGroupComentario = document.getElementById('txtComentarioGroup');

  formGroupGuion.className      = "form-group";
  formGroupComentario.className = "form-group";

  var guion      = fileGuion.value;
  var comentario = txtComentario.value;

  var formData = new FormData();
  formData.append('guion', guion);
  formData.append('comentario', comentario);

  connect = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');

  connect.onreadystatechange = function () {

  connect.open('POST', '?view=modalsMatriz&modal=montaje&id=' + cursoKey + '&action=solicitarMontaje', true);
  connect.setRequestHeader("Content-Type", "multipart/form-data");
  connect.setRequestHeader("X-File-Name", guion.name);
  connect.setRequestHeader("X-File-Size", guion.size);
  connect.setRequestHeader("X-File-Type", guion.type);

PHP Code:

case 'solicitarMontaje':

    // This is the line that has the error of undefined index.

  try {
    if (!isset($_FILES['guion'])) {
        # Code 1: Archivo Guión Field vacía
      throw new Exception(1);
    } elseif (!isset($_POST['comentario']) || $_POST['comentario'] == "") {
        # Code 2: Comentario Field vacío
      throw new Exception(2);

    $tmp_file = $_FILES['guion']['tmp_name'];
    $filename = $_FILES['guion']['name'];

    move_uploaded_file($tmp_file, 'uploads/guiones/'.$filename);

  } catch (Exception $e) {
      # Output message to the screen so that Ajax captures it via connect.responseText @curso_FormMontaje.js
    echo $e->getMessage();
break;  # ./ case 'solicitarMontaje'

I've tried it using FormData() and Content-Type multipart/form-data but it did not work at all. Instead it was making the page be embedded inside the _AJAX_ div that shows the messages returned from the server (such as success messages, errors at some fields i.e fields that were sent empty).

This is what I get as result using FormData when clicking the submit button:


  • 写回答

2条回答 默认 最新


      相关推荐 更多相似问题


      • ¥15 hanzi-writer生成的svg外有一层div,修改div宽高影响的是画布大小,字体在不同视口下完全不相同。我想要让字体跟画布同比例大小该怎么实现?
      • ¥15 Python 编写程序
      • ¥15 Java集合多对一问题集
      • ¥20 PowerShell如何操作记事本?
      • ¥15 intel网卡固件降级失败
      • ¥20 html使用模型的问题
      • ¥15 这些怎么解题啊来个人
      • ¥15 h5套壳IOS Cordova依赖找不到导致编译失败
      • ¥15 分组密码算法misty1的子密钥生成算法c++实现
      • ¥15 vscode的一些报错,希望可以得到解决