2016-07-31 73 views
0

我有我的從頭構建PHP MVC的問題和AJAX在jQuery中的實現,其中表單發送文本數據,接收的數據在JS文件中包含在Dashboard類構造中;自定義PHP MVC和AJAX,JSON的問題JSON中的意外的令牌D

模型(dashboard_model.php

<?php 
class Dashboard_Model extends Model 
{ 

    function __construct() 
    { 
     # code... 
     parent::__construct(); 
    } 

    function xhrInsert(){ 
     $text = $_POST['text']; 

     $sth = $this->db->prepare('INSERT INTO data (text) VALUES (:text)'); 
     $sth->execute(array(':text' => $text)); 

     $data = array('text' => $text, 'id' => $this->db->lastInsertId()); 
     print json_encode($data); 
    } 

    function xhrGetListings(){ 
     $sth = $this->db->prepare('SELECT * FROM data'); 
     $sth->setFetchMode(PDO::FETCH_ASSOC); 
     $sth->execute(); 
     $data = $sth->fetchAll(); 
     print json_encode($data); 

    } 

    function xhrDeleteListing(){ 
     $id = $_POST['id']; 
     $sth = $this->db->prepare('DELETE FROM data WHERE id ="'.$id.'"'); 
     $sth->execute(); 
    } 

} 
?> 

控制器(dashboard.php

它要求它處理Ajax回調默認js文件渲染器。

<?php 
class Dashboard extends Controller 
{ 

    function __construct() 
    { 
     # code... 
     parent::__construct(); 

     Session::init(); 
     $logged = Session::get('loggedin'); 
     if($logged == false){ 
      Session::destroy(); 
      header('location: ../login'); 
      exit; 
     } 

     $this->view->js = array('dashboard/js/default.js'); 
    } 

    function index() { 
     $this->view->render('dashboard/index'); 
    } 

    function logout() { 
      Session::destroy(); 
      header('location: ../login'); 
      exit; 
    } 

    function xhrInsert() // xml http request ajax 
    { 
     $this->model->xhrInsert(); 
    } 

    function xhrGetListings(){ 
     $this->model->xhrGetListings(); 
    } 

    function xhrDeleteListing(){ 
     $this->model->xhrDeleteListing(); 
    } 
} 
?> 

$(function() { 
 

 
\t $.get('dashboard/xhrGetListings', function(o){ 
 
\t \t //console.log(o); 
 
\t \t for (var i =0; i<o.length; i++) 
 
\t \t { 
 
\t \t \t $('#listInserts').append('s<div>'+o[i].text+'<a class="del" rel="'+ o[i].id +'" href="#">X</a></div>'); 
 
\t \t } 
 

 
\t \t $('.del').click(function(){ 
 
\t \t \t delItem = $(this); 
 
\t \t \t var id = $(this).attr('rel'); 
 
\t \t \t 
 
\t \t \t $.post('dashboard/xhrDeleteListing', {'id': id}, function(o){ 
 
\t \t \t \t delItem.parent().remove(); 
 
\t \t \t }, 'json'); 
 

 
\t \t \t return false; 
 
\t \t }); 
 

 
\t },'json'); 
 

 
\t $('#randomInsert').on('submit', function(){ 
 
\t \t var url = $(this).attr('action'); 
 
\t \t var data = $(this).serialize(); 
 
\t \t 
 
\t \t console.log('data received : '+data); 
 
\t \t 
 

 
\t \t $.ajax({ 
 
\t \t \t url: url, 
 
\t \t \t type: 'post', 
 
\t \t \t data: data, 
 
\t \t \t beforeSend : function(xhr){ 
 
\t \t \t \t console.log('before'+xhr); 
 
\t \t \t }, 
 
\t \t \t success : function(data, status, xhr){ 
 
\t \t \t \t console.log(data); 
 
\t \t \t \t $('#listInserts').append('<div>'+data.text+'<a class="del" rel="'+ data.id +'" href="#">X</a></div>'); 
 
\t \t \t }, 
 
\t \t \t error: function(xhr, status, error){ 
 
\t \t \t \t console.log('erreur ajax'); 
 
\t \t \t \t console.log('jqXHR =' + xhr + '|status='+status + '|error='+error); 
 
\t \t \t }, 
 
\t \t \t complete: function(xhr, status){ 
 
\t \t \t \t console.log('complete xhr = ' + xhr + '|status=' + status); 
 
\t \t \t }, 
 
\t \t \t statusCode : { 
 
\t \t \t \t 404 : function() { 
 
\t \t \t \t \t console.log('STATUSCODE : 404 Page not found'); 
 
\t \t \t \t } 
 
\t \t \t } 
 
\t \t }); 
 
\t \t return false; 
 
\t }); 
 

 

 

 
});
<br/> 
 

 
<form id="randomInsert" action="<?PHP echo URL; ?>dashboard/xhrInsert" method="post"> 
 
\t <input type="text" name="text" /> 
 
\t <input type="submit" /> 
 

 
</form> 
 

 
<div id="listInserts"> 
 

 
</div>

看到的鉻顯影劑的結果是:

data received : text=qsdfq 
default.js:35 before[object Object] 
default.js:38 Dashboard Object 
(
    [view] => View Object 
     (
      [js] => Array 
       (
        [0] => dashboard/js/default.js 
       ) 

     ) 

    [model] => Dashboard_Model Object 
     (
      [db] => Database Object 
       (
       ) 

     ) 

) 
{"text":"qsdfq","id":"102"} 
default.js:46 complete xhr = [object Object]|status=success 

當然這是不希望的結果,因爲它顯示未定義並且它不拔出JSON數據即使我把JSON類型的數據放入jQuery中

在Chrome開發者工具的XHR迴應是:

Dashboard Object ([view] => View Object ([js] => Array ([0] => dashboard/js/default.js)) [model] => Dashboard_Model Object ([db] => Database Object ())) {"text":"qsdfq","id":"102"} 

的主要問題似乎是與那些添加的東西

Dashboard Object ([view] => View Object ([js] => Array ([0] => dashboard/js/default.js)) [model] => Dashboard_Model Object ([db] => Database Object ())) 

在返回阿賈克斯結果的頂部是過程中的jQuery $.get$.post,數據類型爲json!

回答

0

我不知道你正在使用哪個MVC。你在問題中發現問題。從您的代碼

的迴應是: -

Dashboard Object ([view] => View Object ([js] => Array ([0] => dashboard/js/default.js)) [model] => Dashboard_Model Object ([db] => Database Object ())) {"text":"qsdfq","id":"102"} 

問題引起了回報: -

Dashboard Object ([view] => View Object ([js] => Array ([0] => dashboard/js/default.js)) [model] => Dashboard_Model Object ([db] => Database Object ())) 

您的代碼工作正常,如果您收到: -

{"text":"qsdfq","id":"102"} 

這裏是我的建議,如果這對你有用。首先檢查你的模型,並寫更改功能: -

function xhrInsert(){ 
    $text = $_POST['text']; 

    $sth = $this->db->prepare('INSERT INTO data (text) VALUES (:text)'); 
    $sth->execute(array(':text' => $text)); 

    $data = array('text' => $text, 'id' => $this->db->lastInsertId()); 
    return json_encode($data); 
} 

現在移動控制器和改變你的功能: -

function xhrInsert() // xml http request ajax 
{ 
    $data = $this->model->xhrInsert(); 
    echo $data; 
    die; 
} 

如果以上沒有工作,嘗試這個

function xhrInsert() // xml http request ajax 
{ 
    $data = $this->model->xhrInsert(); 
    return $data; 
} 

如果兩個選項都不起作用,最後查看它並在視圖內回顯數據。

function xhrInsert() // xml http request ajax 
{ 
    $data = $this->model->xhrInsert(); 
    //Something like below 
    $this->view->render('dashboard/insert', ['data' => $data]); 
}