使用來自ajax的json數據調用渲染數據表中的html元素

我使用Ajax data source (objects)來渲染數據表。這裏是例子JSON：使用來自ajax的json數據調用渲染數據表中的html元素

"data": [{ 
    "news_id": 22, 
    "news_title": "Annual function held in school", 
    "news_details": "Annual function was held in school", 
    "created_at": "2016-02-19 17:01:38", 
    "imgurl": "uploads/images/8.JPG" 
}]

現在，使用最後一個元素"imgurl"，我要呈現在數據表的最後一欄的鏈接。像這樣：uploads/images/8.JPG。我試圖呈現一個自定義列如下：

$('#example').DataTable({ 
     "ajax": '?r=news/ajaxdata', 
     "columns": [ 
      { "data": "news_id" }, 
      { "data": "news_title" }, 
      { "data": "news_details" }, 
      { "data": "created_at" }, 
      { "render": function (data, type, row, meta) { 
      return $('<a>') 
         .attr('href', {"data": "imgurl"}) 
         .text('link') 
         .wrap('<div></div>') 
         .parent() 
         .html(); 
    } }, 

     ] 
    });

這似乎並沒有被做一個適當的方式，因爲它呈現一個鏈接，但HREF元素說[對象] [對象]。我無法找到正確的文檔來執行此操作。任何人都可以幫忙嗎？

嘗試這樣做：

{ "render": function (data, type, row, meta) { 
       var d = JSON.parse(data); 
       var d = d.imgurl; 
      return $('<a>') 
         .attr('href', d) 
         .text('link') 
         .wrap('<div></div>') 
         .parent() 
         .html(); 

    } },

問題是處理Ajax響應。

來源

2016-03-05 Ramesh Pareek

剛打這個。看來datatables render函數只接受一個字符串返回值，並將其視爲原始HTML。但是，這甚至沒有記錄。我很驚訝它不會接受一個DOM元素而不會將其渲染爲「[object]」。我有一種感覺，鑑於各地發佈的例子，那裏有很多不正確的HTML轉義噩夢。 – Jason

第一個參數data包含單元格的數據，因此它將具有圖像URL uploads/images/8.JPG。

使用下面的代碼來代替：

{ 
    data: 'imgurl', //<---- 
    render: function (data, type, row, meta) { 
     return 
      $('<a>') 
       .attr('href', data) 
       .text('link') 
       .wrap('<div></div>') 
       .parent() 
       .html(); 
    } 
},

更多信息請參見columns.render。

來源

2016-03-05 20:22:51

但我只想使用ajax響應的「數據」：「imgurl」部分。這不起作用。 –

@RameshPareek - 已更新gyrocodes答案，他只是忘記了重要的'數據'參考（dataTables如何知道'數據'通過，如果'數據'沒有被設置？） - 猜他專注於'render'部分因爲它很明顯，所以你也必須定義'data'。希望能幫助到你。儘管有點混亂，我認爲陀螺儀的回答正確。 – davidkonrad

@davidkonrad，是的。但是當我向我介紹正確的文檔時，我發現了這一點。：）謝謝。 –

使用來自ajax的json數據調用渲染數據表中的html元素

回答

相關問題