关于ExtJS的工具栏动态添加按钮（从后台数据库读取信息）
我想在工具栏中动态添加按钮，至于添加什么按钮，则从后台数据库中读取信息。//以下是工具栏按钮测试代码，生成JSON
string json = "[{'id': '1','text':'测试1'},{'id':'2','text':'测试2'},{'id':'4','text':'测试3'}]"; json = "{'totalProperty':'3','result':" + json + "}"; our.(json);
ToolBar = function() { 2 3 Ext.Ajax.request({ 4 url: 'rolegroup.aspx', 5 params: '', 6 method: 'POST', 7 success: function(response, options) { 8 //alert('success'); 9 var rsp = Ext.util.JSON.decode(response.responseText);10 var total = rsp.totalProperty;11 //alert(total);12 //alert(rsp.result.text);13 var arrays = new Array(total);14 for (var i = 0; i < total; i++) {15 //arrays = new Ext.Toolbar.Button({ text: rsp.result.text, iconCls: 'icon-home' });16 arrays = { text: rsp.result.text, iconCls: 'icon-home' };17 if (i == (total - 1))18 arr += '{text:' + rsp.result.text + '}'19 else20 arr += '{text:' + rsp.result.text + '},';21 }22 arr = '{[' + arr + ']}';23 alert(arr);24 //alert(arrays.length);25 //alert(arrays['text'] + ',' + arrays['iconCls']);26 var o = { items: arrays };27 //Ext.apply(this, A, o);//不成功？28 Ext.apply(this, o);29 },30 failure: function() {31 Ext.Msg.alert("提示信息", "按钮加载失败,请稍后重试！");32 }33 });34 35 ToolBar.superclass.constructor.call(this, {36 id: 'tool_bar',37 cls: 'top-toolbar',38 })39 };40 41 Ext.extend(ToolBar, Ext.Toolbar);42 43 //在后台创建toolbar = new ToolBar();
以上代码，arrays可以成功读取后台数据，但工具栏并不能显示出相应按钮。也就是说Ext.apply(this, o)并不成功！
事实上，Ajax是异步调用后台数据的，toolbar = new ToolBar()先运行了，但并没有同时立即运行读取后台数据的代码，而是滞后的。后来再运行Ext.apply(this, o)肯定不成功的。
我把代码改成以下所示：
SetToolButtons = function(tbr) { 2 Ext.Ajax.request({ 3 url: 'rolegroup.aspx', 4 params: '', 5 method: 'POST', 6 success: function(response, options) { 7 var rsp = Ext.util.JSON.decode(response.responseText); 8 var total = rsp.totalProperty; 9 var arrays = new Array(total);10 for (var i = 0; i < total; i++) {11 arrays = new Ext.Toolbar.Button({ text: rsp.result.text, iconCls: 'icon-home' });12 }13 tbr.add(arrays);14 tbr.addFill();15 tbr.addButton(16 {17 text: '我的桌面',18 iconCls: 'icon-desktop',19 scope: this20 });21 tbr.addSeparator();22 tbr.addButton();31 },32 failure: function() {33 Ext.Msg.alert("提示信息", "按钮加载失败,请稍后重试！");34 }35 });36 };37 38 Ext.onReady(function() {39 Ext.QuickTips.init();40 var toolbar = new Ext.Toolbar({41 id: 'tool_bar',42 cls: 'top-toolbar'43 });44 SetToolButtons(toolbar);45 }46
页:
[1]