2011-12-20 82 views
1

我必須在itemselector中的右邊多選框中填充值。 首先我需要保持空白,然後在上面的組合框中選擇一個項目,我必須相應地填寫值。我已經嘗試過,現在崩潰了,沒有什麼看起來不對。這裏是代碼片段:「重設()如何動態地將值分配給ExtJS Itemselector中的商店?

var userList = GetUserList(); 
    var aoiList = GetAOIList(); 
    var userAOIs = ""; 
    var selectedUser="";  

    var userStore = new Ext.data.ArrayStore({ 
       fields: ['user'], 
       data: userList 
      }); 

    var aoiStore = new Ext.data.ArrayStore({ 
     fields: ['aoiList'], 
     data: aoiList 
    }); 
    var userAOIStore = new Ext.data.ArrayStore({ 
     fields: ['userAOIs'], 
     data: userAOIs 
    });  

    var aafp = new Ext.FormPanel({ 
     width : 350, 
     frame : true, 
     autoHeight : true, 
     bodyStyle : 'padding: 2px 5px 0 2px;', 
     labelWidth : 100, 
     defaults : { 
      anchor : '95%', 
      allowBlank : false, 
      msgTarget : 'under' 
     }, 
     items : [ { 
      xtype : 'combo', 
      fieldLabel : 'Choose User', 
      emptyText: "Select User...", 
      id : 'userId', 
      name : 'user', 
      multiSelect: false, 
      store: userStore, 
      displayField: 'user', 
      mode: 'local', 
      editable: false, 
      typeAhead: true, 
      triggerAction: 'all', 
      listeners:{select:{fn:function(combo, value) { 
       selectedUser = value.get('user'); 
       userAOIs = myAOIs(selectedUser);     
       userAOIStore = new Ext.data.ArrayStore({ 
        fields: ['userAOIs'], 
        data: userAOIs}); 
       aafp.getForm().findField("itemselector").reset(); 
       }} 
      }, 
      value : selectedUser 

     },{   
      xtype: 'itemselector', 
      name: 'itemselector', 
      fieldLabel: 'AOISelector', 
      imagePath: 'ext-3.4.0/examples/ux/images/', 
      drawUpIcon:false, 
      drawDownIcon:false, 
      drawTopIcon:false, 
      drawBotIcon:false, 
      multiselects: [{ 
       width: 250, 
       height: 200, 
       store: aoiStore, 
       displayField: 'aoiList'    
      },{ 
       width: 250, 
       height: 200, 
       store: userAOIStore, 
       displayField: 'userAOIs', 
       valueField: 'userAOIs'   
      }] 
    }] 

起初我懷疑「 aafp.getForm()findField(」 itemselector)」呼叫,並認爲有可能是一些其他的功能,以動態地重新加載元素在形式中,而不是可能用於重置/擦除字段中的數據的重置,但重置將重新加載內容。 請提供您的輸入如何實現?

感謝

回答

1

你可以試試這個:

1)創建商店。 2)將商店添加到組件 3)當偵聽器'selected'被觸發時,獲取您想要動態添加的存儲組件,並創建一個新記錄並將其添加到商店。

編輯: 嘗試是這樣的(它的什麼,我想你想)注意代碼是不準確的,因爲我不知道你想做什麼,但它應該給你的你的想法需要做。

listeners:{select:{fn:function(combo, value) { 
       var selectedUser = value.get('user'); 

      var record = Ext.data.Record.create([ 
       'user' : selectedUser 
       ]); 

       var cmp = Ext.getCmp('compId');//Get the comp that contains the store you want to add to put the cmp id here to look it up 
       cmp.store.removeAll();//Clear the store 
      cmp.store.add([record]);//Add the new record into the store 

    }, this} 
+0

在我的代碼我試過這個:aafp.getForm()。findField(「itemselector」)。store = userAOIStore; 。aafp.getForm()findField( 「itemselector」)復位();這是修改商店,我可以在調試模式下看到,但它不更新視圖。 – Shariq 2011-12-20 12:22:19

+0

你想做什麼只是添加記錄到商店?我很困惑你爲什麼重置電話? – codemonkeyww 2011-12-20 12:46:28

+0

您能否藉助示例來解釋一下。在我的情況下,我必須更換商店的內容,所以我正在分配。重置對內容沒有任何影響,我叫它更新我的視圖,這不會發生。 – Shariq 2011-12-20 12:58:29

0

感謝您的意見,這很有幫助。

我發現問題:我正在創建一個Ext.data.ArrayStore的新實例,但視圖已鏈接到前一個實例。 所以我使用了前面的例子,刪除了它的所有內容並添加了新的記錄,正如布爾德勒建議的那樣。但是我發現我們不必捕捉itemselector商店的句柄,它會自動更新修改的商店。

樣本:

  var tempUserAOIStore = new Ext.data.ArrayStore({ 
        fields: ['userAOIs'], 
        data: [['8'], ['9']] 
        }); 
      userAOIStore.removeAll(); 
      userAOIStore.add(tempUserAOIStore.getAt(0)); 
      userAOIStore.add(tempUserAOIStore.getAt(1));     

現在這個工廠在ArrayStore對我來說也是一個問題,因爲商店都如此緊密地綁定,如果我想保留一些臨時存儲原始,它也被修改。即

如果我這樣做:

B = A; 

Itemselector: store = A 

A.remove(some records) 

我發現,B也修改爲被修改。我在這裏回答所以猜想必須發佈這個作爲一個單獨的問題