EasyUI Datagrid, how can I auto generate columns?

Question

I have a set of predefined MySQL queries whose results I want to present on an EasyUI datagrid (jQuery).

The problem is that each query returns different result columns, so I cannot use something similar to the jQuery tutorial section Dynamically change datagrid columns, as the column titles are not known before executing the query in the PHP file.

I have EasyUı Grid <table id="dg" title="User Group Authentications" class="easyui-datagrid" style="width:1120px;height:500px"> </table> I did not create any columns, becouse the data I assign to the grid is variable in its columns header and rows. I need some function like auto_column_generator to generate the columns automatically. — Jafar Sabah

Hotdin Gurning Hotdin Gurning · Accepted Answer · 2016-02-18T10:01:12

You can add columns dinamically to easyui datagrid.

Let's say you have a php array that contains column you want to add to the datagrid. Assume that $dwSyntax = your query result from php code. Then build datagrid using javascript like :

$('#datagrid').datagrid ({  
            url:<php url>
            queryParams: <query parameter>,
            height : 350, pagination : true, singleSelect : true, rownumbers : true, fitColumns: false,
            columns : [[
                            <?php
                                $i = 0;
                                while ($i < count($dwSyntax)) {
                                    $row = $dwSyntax[$i];
                                    echo "{ field: '".$row['field']."', title: '".$row['title']."', width: ".$row['width'].", sortable: true, align: '".$row['align']."', rowspan: 1, hidden: false },";
                                    $i++;
                                }
                            ?>
                        ]]
        });

Then insert html like

<div id="datagrid"></div>

make sure you have those keys in $dwsyntax array (field,title,width,align).
I hope you understand what i mean. And if not, then share your query, php and javascript code.
Goodluck.

EasyUI Datagrid, how can I auto generate columns?

1 Answers