Easyuidatagrid dynamically generates Columns

Easyuidatagrid defines columns by using [javascript] $ (& amp; #39; # grid & amp; #39 ;). datagrid ({columns: [[{field: & amp; #39; f1 & amp; #39;, title: & amp; #39; field 1 & amp; #39;, width: 160}, {field: & am

The easyui datagrid defines columns by using the following methods:

[Javascript]
$ ('# Grid'). datagrid ({columns :[[
{Field: 'f1', title: 'field 1', width: 160 },
{Field: 'F2', title: 'field 2', width: 160}
]});

However, in actual projects, we often need the datagrid to dynamically generate columns.

I searched an article on the Internet: I will talk about data loading in easyui datagrid again.

I really admire this author. He can find the function he wants to extend in the obfuscated source code of easyui, which is full of variable combinations of numbers and letters... Strong!

But I do not like this method. After all, modifying the source code has many side effects, and I still like the original ecology.

Dynamic generation of columns, which is a common requirement, is unlikely to be supported by easyui.

It is not mentioned in the official document. Maybe the author wants to earn consulting fees by using these advanced functions...

After talking a lot of nonsense, I have posted a lot of twists and turns:

[Javascript]
Var options = {};
$ (Function (){
Var myNj = 9;
// Initialization
$ ("# Disgrid"). datagrid ({
Type: 'post ',
Nowrap: false,
Striped: true,
Fit: true,
Width: 1024,
Height: 500,
Url :'',
PageSize: 30,
RemoteSort: false,
Pagination: true,
Rownumbers: true,
SingleSelect: true,
QueryParams :{
Nj: myNj,
UnitType: 1
}
});

FetchData (myNj );
});
 
Function fetchData (nj ){
Var s = "";
S = "[[";
S = s + "{field: 'unitname', title: 'unit ', width: 160}, {field: 'practicetime', title: 'test time', width: 160}, {field: 'userid', title: 'userid', width: 120, hidden: 'true'}, {field: 'serial', title: 'serial ', width: 120, hidden: 'true'}, {field: 'unitid', title: 'unitid', width: 100, hidden: 'true '},";

// The definition of the lu todo column can be obtained from the server.
If (nj = 9 ){
S = s + "{field: 'aipanel _ text_exam ', title: 'short-text reading', width: 80}, {field: 'aipanel _ scene_exam', title: 'situational dialogs ', width: 80}, {field: 'aipanel _ oral_exam', title: 'short talking', width: 80 }";
S = s + ", {field: 'tatal _ score ', title: 'Total', width: 60, formatter: function (value, rec) {return paraseIntValue (rec. aipanel_text_exam) + paraseIntValue (rec. aipanel_scene_exam) + paraseIntValue (rec. aipanel_oral_exam );}}";
} Else if (nj = 7 | nj = 8 ){
//....
}
S = s + "]";
Options = {};
Options. url = '/app/search. do ';
Options. queryParams = {
Nj: nj,
UnitType: 1
};
Options. columns = eval (s );
// Add a column to the lu
Options. columns [0]. push (
{
Field: 'desc', title: 'view details', width: 60,
Formatter: function (value, rec ){
Return "details ";
}
}
);

$ ('# Disgrid'). datagrid (options );
$ ('# Disgrid'). datagrid ('reload ');

}

It should be noted that the JSON format defined by the column is very important and cannot be wrong! If the format is incorrect, it cannot work normally.