显示ajax结果数据保存

Question

我正在使用数据&文件格式与ajax保存。我跟着这个帖子uploading-both-data-and-files-in-one-form-using-ajax，工作很好，数据保存在数据库中，文件（图像）存储在他的文件夹中。唯一的问题是，我无法让它在一切正常时显示“成功”，或者出现问题时显示“错误”......它总是向我显示“已执行加载”。但它显示，因为我插入这个，但是当它里面有一个错误不会显示错误...总是“加载已执行”。

我犯了一个错误或成功模式消息的插入代码中，我把<?php echo $alert; ?>形式页面，但该消息未出现......

你能帮我与我的问题？

如果能表现出装载机（以GIF）将是更好的太..

在这里展示您的代码：

JS：

$("form#data").submit(function(){ 
    var formData = new FormData($(this)[0]);  
    $.ajax({ 
     url: "includes/galeria.php?ts=" + new Date().getTime(), 
     type: 'POST', 
     data: formData, 
     async: false, 
     success: function(data) { 
$('.result').html(data); 
alert('Load was performed.'); 
     }, 
     cache: false, 
     contentType: false, 
     processData: false 
    }); 
    return false; 
}); 

galeria.php：

<?php 
    require_once("connection.php"); 
    require_once("settings.php"); 
    $alert = ""; 
    if(isset($_FILES['imgaleria'])) { 
     $extension = pathinfo($_FILES['imgaleria']['name']); 
     $extension = $extension["extension"]; 
     $allowed_paths = explode(", ", $allowed_ext); 
     $valid = 0; 
     for($i = 0; $i < count($allowed_paths); $i++) { 
      if ($allowed_paths[$i] == "$extension") { 
       $valid = 1; 
      } 
     } 
     if ($valid == 1 && $_FILES["imgaleria"]["size"] <= $max_weight) { 
      if (file_exists("../assets/img/galeria/" . $_FILES["imgaleria"]["name"])) { 
       $alert = '<p class="error">' . $_FILES["imgaleria"]["name"] . ' El nombre del archivo ya existe!' . '</p>'; 
      } else { 
       move_uploaded_file($_FILES["imgaleria"]["tmp_name"], "../assets/img/galeria/" . $_FILES["imgaleria"]["name"]); 
       $save = $_FILES["imgaleria"]["name"]; 
       $statement = $conn->prepare("INSERT INTO GALERIA (imgtitulo, imgdescripcion, imgcategoria, imgaleria) VALUES (?, ?, ?, ?)"); 
       if ($statement->execute(array($_POST['imgtitulo'],$_POST['imgdescripcion'],$_POST['imgcategoria'],$save))); 
       $dbSuccess = true; 
       $alert = '<p class="ok">' . ' Oferta agregada satisfactoriamente!' . '</p>'; 
       $dbh = null; 
      } 
     } else { 
      $alert = '<p class="error">' . ' Tipo de archivo inv&aacute;lido!' . '</p>'; 
     } 
    } 
?> 

form page.php：

<form class="form-horizontal" id="data" name="data" method="post" enctype="multipart/form-data"> 
     <fieldset> 
      <?php echo $alert; ?> 
      <div class="control-group"> 
       <label class="control-label col-md-4"><?php echo $translate->__('Image title'); ?> :</label> 
       <div class="col-md-5"> 
        <input type="text" class="form-control" name="imgtitulo" /> 
       </div> 
      </div> 
      <div class="control-group"> 
       <label class="control-label col-md-4"><?php echo $translate->__('Image description'); ?> :</label> 
       <div class="col-md-5"> 
        <textarea id="maxlength_textarea" class="form-control" maxlength="225" name="imgdescripcion" /></textarea> 
       </div> 
      </div> 
      <div class="control-group"> 
       <label class="control-label col-md-4"><?php echo $translate->__('Image category'); ?> :</label> 
       <div class="col-md-5"> 
        <input type="text" class="form-control" name="imgcategoria" /> 
       </div> 
      </div>     
      <div class="control-group"> 
       <label class="control-label col-md-4"><?php echo $translate->__('File to upload'); ?> :</label> 
       <div class="col-md-3"> 
        <input name="imgaleria" type="file" /> 
       </div> 
      </div> 
      <div class="control-group"> 
       <div class="row"> 
        <div class="col-md-12"> 
         <div class="col-sd-offset-9 col-md-12"><br /> 
          <button class="btn btn-info" name="enviar"><i class="fa fa-check"></i> <?php echo $translate->__('Save'); ?></button> 
         </div> 
        </div> 
       </div> 
      </div>   
     </fieldset> 
    </form> 
    <div id="loading" style="display:none;"><img src="assets/img/ajax_loader.gif" /></div> 

Answer 1

您误解了PHP，HTML和JQuery（javascript）之间的关系。

PHP在任何HTML输出到浏览器之前在服务器上执行。在加载页面之后，您不能执行ajax调用，然后使用PHP打印该调用。别这么想。相反，您需要使用JQuery来操作HTML。

所以这jQuery代码是正确的：

success: function(data) { 
    $('.result').html(data); 
} 

但是，你需要带class =“结果”页面上的HTML元素这个工作：

<div class="result">RESULT APPEARS HERE AFTER AJAX CALL</div> 

你实际上应该把目标定一个ID而不是一个班级，所以我会用#result而不是.result和id="result"而不是class="result"。请阅读有关PHP和Javascript交互的初学者书籍，因为您需要在跳入之前了解基础知识。