Ext: the grid page. The column width is automatically filled with the grid width.

VaR CM = new Ext. Grid. columnmodel ([{
Header: 'number ',
Dataindex: 'id'
},{
Header: 'name ',
Dataindex: 'name'
},{
Header: 'description ',
Dataindex: 'desc'
}]);
VaR store = new Ext. Data. Store ({
Proxy: New Ext. Data. httpproxy ({
URL: 'Data. jsp'
}),
Reader: New Ext. Data. jsonreader ({
Totalproperty: 'totalproperties ',
Root: 'root'
},[{
Name: 'id'
},{
Name: 'name'
},{
Name: 'desc'
}])

});
Store. Load ({
Params :{
Start: 0,
Limit: 20
}
});

VaR grid = new Ext. Grid. gridpanel ({
Renderto: Ext. getbody (),
DS: store,
CM: cm,
Autoheight: True, // The grid can display all rows without scrolling.
Viewconfig :{
Forcefit: True // make the grid column automatically fill the entire width of the grid, without setting the width of a column.
},
Bbar: New Ext. pagingtoolbar ({
Pagesize: 20,
Store: store,
Displayinfo: True,
Displaymsg: 'display records from {0} to {1}, total records from {2 ',
Emptymsg: "No record"
})
});

You can set the adaptive width of a column in the table to fill in the remaining width of the grid.

To set the ID in CM:

VaR CM = new Ext. Grid. columnmodel ([{
Header: 'number ',
Dataindex: 'id'
},{
Header: 'name ',
Dataindex: 'name'
},{
ID: 'description ',
Header: 'description ',
Dataindex: 'desc'
}]);

Then, add the following to the initial configuration of the grid:
Autoexpandcolumn: 'description', // first add an ID to the column in cm, and then set the ID of the column to be automatically adapted by grid.

 

JSP code:

<%
String start = request. getparameter ("START ");
String Limit = request. getparameter ("Limit ");
Try {
Int Index = integer. parseint (start );
Int pagesize = integer. parseint (Limit );
String JSON = "{totalproperty: 100, root :[";
For (INT I = index; I <pagesize + index; I ++ ){
JSON + = "{ID:" + I + ", name: 'name" + I + "', descn: 'descn"
+ I + "'}";
If (I! = Pagesize + index-1 ){
JSON + = ",";
}
}
JSON + = "]}";
Response. getwriter (). Write (JSON );
} Catch (exception ex ){
}
%>