jQuery UI Widgets › Forums › Grid › dynamic columns
This topic contains 5 replies, has 3 voices, and was last updated by Hristo 4 years, 1 month ago.
-
Authordynamic columns Posts
-
Good morning,
I followed the instructions at in order to obtain a grid that could load the data with dynamic columns.
the code of forum is below:$(document).ready(function () { var json = '[{ "columns": [{ "text": "Name", "datafield": "name", "width": "250" },{ "text": "Beverage Type", "datafield": "type", "width": "250" }, { "text": "Calories", "datafield": "calories", "width": "180" }, { "text": "Total Fat", "datafield": "totalfat", "width": "120" }, { "text": "Protein", "datafield": "protein" }] }, {"rows" : [{"id": "1", "name": "Hot Chocolate", "type": "Chocolate Beverage", "calories": "370", "totalfat": "16g", "protein": "14g"}, {"id": 2, "name": "Peppermint Hot Chocolate", "type": "Chocolate Beverage", "calories": "440", "totalfat": "16g", "protein": "13g"}, {"id": "3", "name": "Salted Caramel Hot Chocolate", "type": "Chocolate Beverage","calories": "450", "totalfat": "16g", "protein": "13g"}]}]'; var obj = $.parseJSON(json); var columns = obj[0].columns; var datafields = new Array(); for (var i = 0; i < columns.length; i++) { datafields.push({ name: columns[i].datafield }); } var rows = obj[1].rows; // prepare the data var source = { datatype: "json", datafields: datafields, id: 'id', localdata: rows }; var dataAdapter = new $.jqx.dataAdapter(source); $("#jqxgrid").jqxGrid( { width: 670, source: dataAdapter, columnsresize: true, columns: columns }); });
Now, every thing seem works correctly, but I need to replace the json data. I get data from a kind of this php file:
include("../connessione.php"); $strsql="SELECT id,des from queryore"; $result = mysqli_query($con, $strsql); while($row=mysqli_fetch_assoc($result)) { $rows[] = array_map('utf8_encode', $row); //con array_map faccio l'encoding dei caratteri speciali } echo json_encode($rows);
How can I get a local data json from php?
I tried with $.getJSON but it seems that the returned data from php do not contain some information. I used this code:function InitGrid(id) { var url = "carica_dati.php?id=" + id; $.getJSON( url, { }, function (data) { for (var i = 0; i < data[0].columns.length; i++) { if (data[0].columns[i].cellbeginedit != undefined) { data[0].columns[i].cellbeginedit = beginedit; } } var columns = data[0].columns; var rows = data[1].rows; var columngroups = data[2].columngroups; // prepare the data var source = { datatype: 'json', localdata: rows }; var dataAdapter = new $.jqx.dataAdapter(source); $('#OreVoloGrid').jqxGrid({ source: dataAdapter, width: '96%', height: 450, autorowheight: false, altrows: true, editable: true, pageable: true, sortable: true, // filterable: true, pagesize: 15, columnsresize: true, columns: columns, columngroups: columngroups }); }); }
But I’m not albe to load data.The error in the debug is: “data[0].columns is undefined”
Is it due to the result of php file? Haven’t I to use “json_encode”?Thank you very much for every suggestions
NicolaHello Nicola,
I would like to suggest you firstly try to get the data as JSON.
After that, it will be easy to follow the approach from the demo.Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.comHello Hhristo, thanks for the answer.
As a matter of fact I was asking how I can get data as json. Is my method reported with code wrong? I use it when load data in a grid and it works correctly, but if I use it to populate a local variable it doesn’t run. As I written in the previous post seems that json returned from php has a lack of information, for example it doesn’t has data about columns name, or I think so.
I’d like to have a suggestion how get correctly json data trough php and store it in var for define columns.
Thanks in advance for every.Hello nico77,
I would like to mention that we provide solutions and suggestions for our library.
I do not have much experience with the PHP (and there is no full example) but you could try to echo the result and to see what is the result.
The error message that you mentioned looks like there is no such field.
Please, try to check there for this.Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.comHi,
I am trying to export the grid data into excel from 3rd page (per page 100 and i have 520 records) not exporting into excel (getting blank excel with headers). But when i am in first page and do the export working fine. but if i move to any other page other than first page not working. Please help on this.
Used Code :
var xml = $(this).jqxGrid(“exportdata”, “xls”);
if (xml != undefined) {
var $xml = $(xml);
if (exportInfo == ”) {
exportInfo = xml;
}
}});
exportInfo = (new XMLSerializer()).serializeToString(xmlExportInfo);
createForm(“ReportData”, “xls”, exportInfo);Hello Arun Baskar,
Could you clarify it?
Because I tested this example and it seems to work fine.Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.