2016-11-05 86 views
0

提交模态对话框窗体时,我无法获得ajax响应。当表单不是模态时,它完美地工作。在jquery模态窗体对话框中获取ajax响应

形式:

<div id="form2" style="display: none"> 
    <form id="objectInsert" action="element/create" method="POST" enctype="multipart/form-data"> 
     <div class="form-group"> 
      <label for="name">Name</label> 
      <input class="form-control" type="text" name="name" id="name"/> 
     </div> 

     <div class="form-group"> 
      <label for="description">Description</label> 
      <textarea class="form-control" name="description"></textarea> 
     </div> 
    </form> 

在这里,我在控制台中阿贾克斯成功的一部分!

$("#objectInsert").submit(function(e) { 
    e.preventDefault(); 
    resetErrors(); 
    var form = this; 
    var url = $(this).attr('action'); 
    var data = new FormData($(this)[0]); 
    $.ajax({ 
     type: 'POST', 
     url: url, 
     data: data, 
     dataType: 'json', 
     cahe:false, 
     processData: false, 
     contentType: false, 
     success: function(resp) { 
      console.log(resp);//Working 
     }, 
     error: function() { 
      console.log('there was a problem checking the fields'); 
     } 
    }); 
}); 

在这里我得到控制台中的ajax错误部分!有人能告诉我我在哪里做错了吗?

$("#add_element").click(function(){ 
     $("#form2").dialog({ 
      modal:true, 
      width:400, 
      buttons:{ 
       Send:function(e){ 
        e.preventDefault(); 
        var form = $("#objectInsert"); 
        var url = form.attr('action'); 
        var data = new FormData(form[0]); 
        $.ajax({ 
         type: 'POST', 
         url: url, 
         data: data, 
         dataType: 'json', 
         cahe:false, 
         processData: false, 
         contentType: false, 
         success: function(resp) { 
          console.log(resp);//not working 
         }, 
         error: function(xhr, status, error) { 
          console.log('there was a problem checking the fields'); 
          console.log(xhr); 
          console.log(error); 
         } 
        }); 
        return false; 

       }, 
       Cancel:function(){ 
        $(this).dialog("close"); 
       } 
      } 
     }); 
    }); 

控制器

public function create() { 
    try{ 
     $this->form = new Form(); 
     $this->form->post('name'); 
     $this->form->val('isEmpty', 'name'); 
     $this->form->post('description'); 
     $this->form->val('isEmpty', 'description'); 

     $this->form->fetch(); 
     $this->form->submit(); 

     $data = $this->form->get_postData(); 

     $this->model->insert($data); 

     echo json_encode('success'); 
    } catch (Exception $ex) { 
     $errors = $this->form->get_error(); 
     $_SESSION["errors"] = $errors; 
     //This is for ajax requests: 
     if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && 
       strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) 
       == 'xmlhttprequest') { 
      echo json_encode($_SESSION['errors']); 
      exit; 
     } 

     foreach ($_SESSION["errors"] as $errors){ 
      echo $errors; 
      echo '<br/>'; 
     }exit; 
    } 
} 
+2

你检查错误的原因在控制台? –

+0

使用传递给错误处理程序的参数:['Function(jqXHR jqXHR,String textStatus,String errorThrown)'](https://api.jquery.com/jquery.ajax/) – Andreas

+0

感谢您的建议。我已经添加了错误处理程序。抛出的错误是:“SyntaxError:JSON.parse:JSON数据的第1行第1列的意外字符返回window.JSON.parse(data +”“);”这是console.log(错误);行 – Prosp

回答

-1

看到这个代码,您没有关闭该功能块

success: function(resp) { 
     console.log(resp);//not working 
     },//This is not closed for success function 
error: function() { 
     console.log('there was a problem checking the fields'); 
     } 
+0

这不是代码中唯一缺失的支架... – Andreas

+0

哦对不起!,我的眼睛第一次发现了它。 :) –

+0

还需要一个逗号 – charlietfl