使用jQuery顯示返回的JSON對象

我無法弄清楚如何顯示一些返回的JSON對象。使用jQuery顯示返回的JSON對象

我的腳本是這樣工作的：

我正在做一個Ajax調用，送了一些PARAMS到笨控制器在那裏我有一個模型處理它，使一些查詢朝着數據庫，然後返回json_encoded行到ajax回調函數。這工作很好btw。

這就是我現在想做的事情，這裏是我卡住的地方。我希望新的JSON對象（包含數據庫行）「替換」html表中的舊行。所以我希望它根據我傳遞的參數更新表格，但只能在tbody的頭腦中。

我是jquery的新手，所以我嘗試了幾件事情。我已經嘗試迭代通過JSON數據並使用$ .html（string）函數，但我想這會取代一切，它最終只會顯示最後一個對象（我是吧？）。

所以我想知道如何在一般意義上，我會這樣做？

來源

2012-03-14 Pontus Nordh

你可以發佈你正在嘗試使用JS代碼？ – 2012-03-14 19:39:03

$.ajax({ 
    type: 'GET', 
    url: 'someSite.com/someEndpoint' 
    data: xyz. 
    success: function(response) { 
     //lets say you have an object like this: object = { data: { ... } } 
     var html = ''; 
     for(var i = 0; i<response.data.length; i++) { 
      html += '<tr><td>'+response.data[i].title+'</td></tr>'; 
     } 
     $('#someTable tbody').html(html); 
    } 
});

來源

2012-03-14 19:42:51 Kristian

你不有在AJAX請求返回的JSON對象。嘗試將$ .ajax調用的data_type配置設置設置爲「html」（或將其保留爲空 - jQuery真的很適合從響應數據中找出它）。

我通常會將視圖的<tbody>...</tbody>部分分解爲部分自己的視圖。然後，「原始」頁面加載可以使用它，更新AJAX調用也是如此。

唯一的星號是如果你需要某種面向對象的響應以及HTML。我通常會做這樣的事情：

{ 
    "stat": "ok", 
    "payload": "<tr><td>row1</td></tr><tr><td>row2</td></tr>" 
}

然後在阿賈克斯成功的功能：

$.post('/controller/action', { some: 'data' }, function(response) { 
    $('#my_table tbody').append(response.payload); 
}, 'json');

來源

2012-03-14 19:46:14 landons

我想我會試着用桌子的一部分來看待這個事情..聽起來很整齊，謝謝！ – 2012-03-14 20:40:12

什麼都在你的PARAMS傳球？

例如，您可能使用select或input字段觸發ajax調用並將其值作爲參數傳遞。

var tableObj = { 

    var init : function(){ 
     //check that your selectors id exists, then call it 
     this.foo(); 
    }, 
    foo : function(){ 

     var requestAjax = function(param){ 
      var data = {param : param} 
      $.ajax({ 

       data : data, 
       success : function(callback){ 
        console.log(callback);//debug it 

        $("tbody").empty();//remove existing data 

        for(var i =0; i < callback.data.length; i++){}//run a loop on the data an build tbody contents 

        $("tbody").append(someElements);//append new data 
       } 
      }); 
     } 
     //trigger event for bar 
     $("#bar").keyup(function(){ 
       requestAjax($(this).val()); 
     }); 
    } 

} 

$(function(){ 
    tableObj.init(); 
})

你的PHP方法

public function my_method(){ 
    if($this->input->is_ajax_request()) 
    { 
     //change the output, no view 
     $json = array(
      'status' => 'ok', 
      'data' => $object 
     ); 

     $this->output 
      ->set_content_type('application/json') 
      ->set_output(json_encode($json)); 
    } 
    else 
    { 
     show_404(); 
    } 
}

來源

2012-03-14 21:07:05 Philip

使用jQuery顯示返回的JSON對象

回答

相關問題