2013-01-04 10 views
11

Sto utilizzando il plug-in DataTables di jquery sulla mia applicazione e sono davvero felice fino ad ora con la funzionalità, sebbene mi piacerebbe passare i dati in modo leggermente diverso all'attributo aaData.Invio di oggetti JSON in DataTables aaData anziché array

momento sembra solo di accettare l'array JavaScript come

[ 
    ['value','value','value'], 
    ..., 
    ..., 
] 

Mi piacerebbe essere in grado di utilizzare un oggetto piuttosto che le matrici perché sarà più pulito e mi aiuta a estendere alcuni di filtraggio che sto facendo più facile. come posso passare una variabile javascript che assomiglia a questo (non caricando tramite AJAX).

[ 
    {'id':1,'status':0,'name': 'hello world'}, 
    ..., 
    ..., 
] 

Esempio cercando di utilizzare sAjaxSource con variabile locale http://live.datatables.net/utecax/edit#

Esempio cercando di utilizzare array di oggetti con aaData http://live.datatables.net/iyavud/5/edit

+1

qualcosa di simile? http://www.datatables.net/release-datatables/examples/ajax/objects.html –

+0

sì il problema che ho con questo è che non sto caricando tramite una fonte esterna. i dati sono solo una variabile javascript e quindi "sAjaxSource" lamenta – BillPull

+0

hai provato a utilizzare 'aaData' invece di' sAjaxSource'? .. quindi definisci le colonne come nell'esempio? –

risposta

24

È possibile passare nella matrice di oggetti tramite proprietà aaData, quindi utilizzare proprietà aoColumns per definire quale colonna deve ricevere quali dati

$('#example').dataTable({ 
     "bProcessing": true, 
     "aaData": data,// <-- your array of objects 
     "aoColumns": [ 
      { "mData": "render_engine" }, // <-- which values to use inside object 
      { "mData": "browser" }, 
      { "mData": "platform" }, 
      { "mData": "enging_version" }, 
      { "mData": "css_grade" } 
     ] 
    }); 
+2

La soluzione ha funzionato correttamente, ma il collegamento fornito non è correlato al problema. –

+1

Nella nuova versione di datatables.net 1.10.12, 'aaData' diventa' data' e 'aoColumns' diventa' columns'; La soluzione aggiornata può essere trovata in [JSFiddle] (https://jsfiddle.net/hifni/9pj1jv3d/1/) – hiFI