Autogrid.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. Ext.ns("Ext.ux");
  2. Ext.ux.AutoGridPanel = Ext.extend(Ext.grid.EditorGridPanel, {
  3. initComponent : function(){
  4. if(this.columns && (this.columns instanceof Array)){
  5. this.colModel = new Ext.grid.ColumnModel(this.columns);
  6. delete this.columns;
  7. }
  8. // Create a empty colModel if none given
  9. if(!this.colModel) {
  10. this.colModel = new Ext.grid.ColumnModel([]);
  11. }
  12. Ext.ux.AutoGridPanel.superclass.initComponent.call(this);
  13. // register to the store's metachange event
  14. if(this.store){
  15. this.store.on("metachange", this.onMetaChange, this);
  16. }
  17. // Store the column model to the server on change
  18. if(this.autoSave) {
  19. this.colModel.on("widthchange", this.saveColumModel, this);
  20. this.colModel.on("hiddenchange", this.saveColumModel, this);
  21. this.colModel.on("columnmoved", this.saveColumModel, this);
  22. this.colModel.on("columnlockchange", this.saveColumModel, this);
  23. }
  24. },
  25. onMetaChange : function(store, meta) {
  26. // console.log("onMetaChange", meta.fields);
  27. // loop for every field, only add fields with a header property (modified copy from ColumnModel constructor)
  28. var c;
  29. var config = [];
  30. var lookup = {};
  31. for(var i = 0, len = meta.fields.length; i < len; i++) {
  32. c = meta.fields[i];
  33. if(c.header !== undefined){
  34. if(typeof c.dataIndex == "undefined"){
  35. c.dataIndex = c.name;
  36. }
  37. if(typeof c.renderer == "string"){
  38. c.renderer = Ext.util.Format[c.renderer];
  39. }
  40. if(typeof c.id == "undefined"){
  41. c.id = 'c' + i;
  42. }
  43. if(c.editor) {
  44. if (c.editor.isFormField) {
  45. c.editor = new Ext.grid.GridEditor(c.editor);
  46. } else if (c.editor.readOnly === true) {
  47. delete c.editor;
  48. } else {
  49. var field = Ext.ComponentMgr.create(c.editor, 'textfield');
  50. c.editor = new Ext.grid.GridEditor(field);
  51. }
  52. } else if (this.editable === true) {
  53. c.editor = new Ext.grid.GridEditor(new Ext.form.TextField());
  54. }
  55. c.sortable = true;
  56. //delete c.name;
  57. config[config.length] = c;
  58. lookup[c.id] = c;
  59. }
  60. }
  61. // Store new configuration
  62. this.colModel.config = config;
  63. this.colModel.lookup = lookup;
  64. this.reconfigure(this.store, this.colModel);
  65. this.view.fitColumns();
  66. // Re-render grid
  67. if(this.rendered){
  68. this.view.refresh(true);
  69. }
  70. this.view.autoExpand(true);
  71. //this.view.hmenu.add(
  72. // {id:"reset", text: "Reset Columns", cls: "xg-hmenu-reset-columns"}
  73. //);
  74. },
  75. saveColumModel : function() {
  76. // Get Id, width and hidden propery from every column
  77. var c, config = this.colModel.config;
  78. var fields = [];
  79. for(var i = 0, len = config.length; i < len; i++)
  80. {
  81. c = config[i];
  82. fields[i] = {name: c.name, width: c.width};
  83. if(c.hidden) {
  84. fields[i].hidden = true;
  85. }
  86. }
  87. var sortState = this.store.getSortState();
  88. // Send it to server
  89. //console.log("save config", fields);
  90. Ext.Ajax.request({
  91. url: this.saveUrl,
  92. params : {fields: Ext.encode(fields), sort: Ext.encode(sortState)}
  93. });
  94. }
  95. });