顯示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交互的初學者書籍，因爲您需要在跳入之前瞭解基礎知識。