ExtJSのツールバーについて動的にボタンを追加します（バックグラウンドデータベースから情報を読み取ります）。

転載:http://www.cnblogs.com/wangsj/archive/2010/05/25/1743338.html
問題の検討：http://home.cnblogs.com/group/topic/39468.html
作者：王善軍
 
 
 
 
 
ツールバーにボタンを動的に追加したいですが、どのボタンを追加するかはバックグラウンドデータベースから情報を読み取ります。
バックグラウンドコード
 

//            ，  JSON
        string json = "[{'id': '1','text':'  1'},{'id':'2','text':'  2'},{'id':'4','text':'  3'}]";
        json = "{'totalProperty':'3','result':" + json + "}";
        Response.Write(json);

 
 
ところで、JSはどう書きますか？この問題は長い間悩んでいます。以下のコードを書き始めましたが、成功しませんでした。
 

Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--> 1 ToolBar = function() {
     
     Ext.Ajax.request({
         url: 'rolegroup.aspx',
         params: '',
         method: 'POST',
         success: function(response, options) {
             //alert('success');
             var rsp = Ext.util.JSON.decode(response.responseText);
             var total = rsp.totalProperty;
             //alert(total);
             //alert(rsp.result[0].text);
             var arrays = new Array(total);
             for (var i = 0; i < total; i++) {
                 //arrays[i] = new Ext.Toolbar.Button({ text: rsp.result[i].text, iconCls: 'icon-home' });
                 arrays[i] = { text: rsp.result[i].text, iconCls: 'icon-home' };
                 if (i == (total - 1))
                     arr += '{text:' + rsp.result[i].text + '}'
                 else
                     arr += '{text:' + rsp.result[i].text + '},';
             }
             arr = '{[' + arr + ']}';
             alert(arr);
             //alert(arrays.length);
             //alert(arrays[1]['text'] + ',' + arrays[1]['iconCls']);
             var o = { items: arrays };
             //Ext.apply(this, A, o);  //   ？
             Ext.apply(this, o);
         },
         failure: function() {
             Ext.Msg.alert("    ", "      ,     ！");
         }
     });
     
     ToolBar.superclass.constructor.call(this, {
         id: 'tool_bar',
         cls: 'top-toolbar',
     })
 };
 
 Ext.extend(ToolBar, Ext.Toolbar);
 
 //     toolbar = new ToolBar();

 
 
 
        以上のコードで、arraysはバックグラウンドデータの読み取りに成功しましたが、ツールバーには対応するボタンが表示されません。つまりExt.apply（this） o）成功していません
 
実際には、Ajaxは非同期でバックグラウンドデータを呼び出して、toolbar=new ToolBar（）は先に実行しましたが、同時にバックグラウンドデータを読み取るコードを実行していません。ヒステリシスです。その後、Ext.applyを実行します。 絶対成功しません。
 
 
コードを以下のように変更します。
 
 

Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--> 1 SetToolButtons = function(tbr) {
     Ext.Ajax.request({
         url: 'rolegroup.aspx',
         params: '',
         method: 'POST',
         success: function(response, options) {
             var rsp = Ext.util.JSON.decode(response.responseText);
             var total = rsp.totalProperty;
             var arrays = new Array(total);
             for (var i = 0; i < total; i++) {
                 arrays[i] = new Ext.Toolbar.Button({ text: rsp.result[i].text, iconCls: 'icon-home' });
             }
             tbr.add(arrays);
             tbr.addFill();
             tbr.addButton(
             {
                 text: '    ',
                 iconCls: 'icon-desktop',
                 scope: this
             });
             tbr.addSeparator();
             tbr.addButton([
             {
                 text: '    ',
                 iconCls: 'icon-user'
             },
             {
                 text: '    ',
                 iconCls: 'icon-exit'
             }]);
         },
         failure: function() {
             Ext.Msg.alert("    ", "      ,     ！");
         }
     });
 };
 
 Ext.onReady(function() {
     Ext.QuickTips.init();
     var toolbar = new Ext.Toolbar({
         id: 'tool_bar',
         cls: 'top-toolbar'
     });
     SetToolButtons(toolbar);
 }

 
 
 
まずツールバーを作成して、ボタンを追加します。一回で追加します。結果実行成功！
私は多くのネット友達の提供する資料を調べて、みんなの考えを結び付けて、やっと以上のコードがあって、ここで心から広大なネット友達に感謝します！
 
 
この文章が皆さんの役に立つことを望みます。