javascript - Updating Columns Dynamically - Alloy UI -
i'm trying change columns dynamically in alloy ui datatable - depending on button selected, columns changed depending on data returned.
my columns updated, actual data never included in table. when don't define columns both columns , data returned - of course want control of how columns displayed , want set attributes
below code:
var datatable = new y.datatable({ //defining datatable no columns preset editevent: 'dblclick', plugins: [{ cfg: { highlightrange: false }] }); button.on( 'click', //on click... function() { var category = $(this).attr("id"); //value retrieved id of button selected datasource = new y.datasource.io({source: '/searchmydata datasource.sendrequest({ datatype: 'json', on: { success: function(e) { response = e.data.responsetext; setcolumnnames(category); //set columns... data = y.json.parse(response); datatable.set('data', data);//then data datatable.render('#my-container'); }, failure: function() { alert(e.error.message); } } }); function setcolumnnames(tabname){ //defining columns var columns1 = [ { key: 'id', label: 'id', width: '70px' }, { key: 'name', label: 'name', width: '70px' } ]; var columns2 = [ { key: 'id', label: 'id', width: '70px' }, { key: 'addr', label: 'address', width: '70px' } ]; switch (category) { case "person": datatable.set('columns', columns1); break; case "address": datatable.set('columns', columns2); break; default: console.log(''); }
there's no issue data returning ajax request, when comes loading table new set of columns defined. i've tried reset()
method on both columns , data on each click, no luck.
it turns out keys returned request being capitalized , included underscores (just how they're defined in database) - i've noticed defining columns key
case sensitive. if changed single character lower case upper column not display data.
Comments
Post a Comment