버튼을 클릭 한 후 ExtJs : 격자 표시

Question

양식이 표시되는 즉시 격자 값이 채워지는 양식이 있습니다. 그러나 텍스트 상자 값을 기준으로 단추를 클릭 한 후에 표를 채울 필요가 있습니다.

는 ExtJS :

var url = location.href.substring(0,location.href.indexOf('/', 14));   
     var grid; 
     var store; 
     var userStore; 
     Ext.onReady(function(){ 
      var rowEditing = Ext.create('Ext.grid.plugin.RowEditing'); 

      Ext.define('userList', { 
       extend: 'Ext.data.Model', 
       fields: [{ name: 'id', mapping: 'id' }, 
         { name: 'name', mapping: 'name' }, 
         { name: 'firstName' ,mapping:'personalInfo.firstName'}, 
         { name: 'lastName' ,mapping:'personalInfo.lastName'}, 
         { name: 'gender' ,mapping:'personalInfo.gender'}, 
         { name: 'email' ,mapping:'personalInfo.address.email'} 
         ] 
      }); 

      store = Ext.create('Ext.data.Store', { 
       model: 'userList', 
       autoLoad: true, 
       proxy: { 
        type: 'ajax', 
        url : url+'/lochweb/loch/users/getUser', 
        reader: { 
         type: 'json', 
         root: 'Users' 
        } 
       } 
      }); 

      function swapStrore(){ 
       //userStore = store;     
       userStore = Ext.create('Ext.data.Store', { 
         model: 'userList', 
         autoLoad: true, 
         proxy: { 
          type: 'ajax', 
          url : url+'/lochweb/loch/users/getUser', 
          reader: { 
           type: 'json', 
           root: 'Users' 
          } 
         } 
        }); 
       Ext.getCmp('userGrid').getView().refresh(); 
       return userStore; 
      } 

      function updateUsers(id){ 
       window.location = url+'/lochportal/createUser.do'; 
      } 

      var searchUsers = new Ext.FormPanel({ 
       renderTo: "searchUsers", 
       frame: true,    
       title: 'Search Users', 
       bodyStyle: 'padding:5px',   
       width: 900, 
       items:[{ 
        xtype:'textfield', 
        fieldLabel: 'Username', 
        name: 'userName'    
       },{ 
        xtype:'textfield', 
        fieldLabel: 'First Name', 
        name: 'firstName' 
       },{ 
        xtype:'textfield', 
        fieldLabel: 'Last Name', 
        name: 'lastName' 
       }, 
       { 
        xtype: 'button', 
        text: 'Search', 
        listeners: { 
         click: function(){ 
          Ext.Ajax.request({ 
           method:'GET', 
           url : url+'/lochweb/loch/users/getUser', 
           params : searchUsers.getForm().getValues(), 
           success : function(response){ 
            //console.log(response); 
            //swapStrore(); 
           } 
          }); 
         }      
        } 
       },{ 
        xtype: 'button', 
        text: 'Cancel', 
        listeners: { 
         click: function(){ 
          window.location = url+'/lochportal/viewSuccessForm.do'; 
         }      
        } 
       },    
       grid = Ext.create('Ext.grid.Panel', {     
         //plugins: [rowEditing], 
         id:'userGrid', 
         width: 900, 
         height: 300, 
         frame: true,       
         store: store, 
         iconCls: 'icon-user', 
         columns: [{ 
          text: 'ID', 
          width: 40, 
          sortable: true, 
          dataIndex: 'id' 
         }, 
         { 
          text: 'Name', 
          flex: 1, 
          sortable: true, 
          dataIndex: 'name', 
          field: { 
           xtype: 'textfield' 
          } 
         }, 
         { 
          text: 'FirstName', 
          flex: 1, 
          sortable: true, 
          dataIndex: 'firstName', 
          field: { 
           xtype: 'textfield' 
          } 
         }, 
         { 
          text: 'LastName', 
          flex: 1, 
          sortable: true, 
          dataIndex: 'lastName', 
          field: { 
           xtype: 'textfield' 
          } 
         }, 
         { 
          text: 'Gender', 
          flex: 1, 
          sortable: true, 
          dataIndex: 'gender', 
          field: { 
           xtype: 'textfield' 
          } 
         }, 
         { 
          text: 'Email', 
          flex: 1, 
          sortable: true, 
          dataIndex: 'email', 
          field: { 
           xtype: 'textfield' 
          } 
         }, 
         { 
          xtype: 'actioncolumn', 
          width: 50, 
          items:[{ 
            icon : '/lochportal/extJS/resources/themes/images/access/window/edit.gif', // Use a URL in the icon config 
            tooltip: 'Sell stock', 
            handler: function(grid, rowIndex, colIndex) { 
             var rec = store.getAt(rowIndex); 
             //alert("Sell " + rec.get('id')); 
             updateUsers(rec.get('id')); 
            } 
           }] 

         }] 
        })]  
      }); 


      var win = new Ext.Window({ 
       layout:'fit', 
       closable: false, 
       resizable: true, 
       plain: true, 
       border: false, 
       items: [searchUsers] 
      }); 
      win.show(); 
     }); 

검색 버튼을 클릭 한 후 어떻게 그리드를 채우는?

감사

Answer 1

사용 이미 표시되어 그리드에 신규 또는 다른 저장소를 할당하는 그리드의 bindStore() 방법. 빈 표를 먼저 표시하려면 모든 레코드를 필터링하거나 store 속성을 초기에 null에 할당하십시오.