extjsはrowclickリスナーでグリッドセルタイプを変更します

Question

私はextjsグリッドパネルに3つのカラムuser、email、passwordを持っています。 rowclickイベントで、パスワードを復号化したいと思います。私はパスワードフィールドの列の設定で 'テキスト'にタイプを設定することでこれを試しています。

しかし、私は復号化されたパスワードを見ることができません。

私に解決策を提案してください。

ありがとうございます。 ExtJSのグリッドで

Ext.create('Ext.data.Store', { 
     storeId: 'simpsonsStore', 
     fields: ['name', 'email', 'phone'], 
     data: [{ 
      "name": "Lisa", 
      "email": "lisa@simpsons.com", 
      "pass": "555-111-1224" 
     }, { 
      "name": "Bart", 
      "email": "bart@simpsons.com", 
      "pass": "555--1234" 
     }, { 
      "name": "Homer", 
      "email": "homer@simpsons.com", 
      "pass": "-222-1244" 
     }, { 
      "name": "Marge", 
      "email": "marge@simpsons.com", 
      "pass": "111-1254" 
     }] 
    }); 

    Ext.create('Ext.grid.Panel', { 
     title: 'Simpsons', 
     store: Ext.data.StoreManager.lookup('simpsonsStore'), 
     listeners: { 
      rowclick: function (grid, record, e) { 
       var _this = this; 
       showPass('text'); 
       function showPass(val) { 
        _this.getEl().component.columns[2].setConfig('type', "text"); 
       } 
       } 
      }, 
     columns: [{ 
      header: 'Name', 
      dataIndex: 'name', 
      editor: 'textfield' 
     }, { 
      header: 'Email', 
      dataIndex: 'email', 
      flex: 1 
     }, { 
      header: "Password", 
      dataIndex: 'pass', 
      inputType: 'password', 
      renderer: function(val) { 
       var toReturn = ""; 
       for (var x = 0; x < val.length; x++) { 
        toReturn += "&#x25cf;"; 
       } 

       return toReturn; 
      } 
     }], 
     selType: 'rowmodel', 
     height: 200, 
     width: 400, 
     renderTo: Ext.getBody() 
    }); 

Answer 1

あなたはそれがwidgetcolumn内XTYPEを追加する設定を提供 widgetcolumn を使用することができます。あなたは参照することができますExtJs widgetcolumn docs

私は小さなデモを作成して、どのように動作するかを示しています。 Sencha fiddle example

希望すると助かります。セキュリティのバックグラウンドを持つ

Ext.create('Ext.data.Store', { 
    storeId: 'simpsonsStore', 
    fields: ['name', 'email', 'phone'], 
    data: [{ 
     "name": "Lisa", 
     "email": "lisa@simpsons.com", 
     "pass": "555-111-1224" 
    }, { 
     "name": "Bart", 
     "email": "bart@simpsons.com", 
     "pass": "555--1234" 
    }, { 
     "name": "Homer", 
     "email": "homer@simpsons.com", 
     "pass": "-222-1244" 
    }, { 
     "name": "Marge", 
     "email": "marge@simpsons.com", 
     "pass": "111-1254" 
    }] 
}); 

Ext.create('Ext.grid.Panel', { 
    title: 'Simpsons', 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    listeners: { 
     select: function (grid, record, index) { 
      this.doChangeInputType(this.query('#password')[index]); 
     }, 
     deselect: function (grid, record, index) { 
      this.doChangeInputType(this.query('#password')[index]); 
     }, 
     rowclick: function (grid, record, element, rowIndex, e, eOpts) { 
      this.getSelectionModel().select(record) 
     } 
    }, 
    columns: [{ 
     header: 'Name', 
     dataIndex: 'name', 
     editor: 'textfield' 
    }, { 
     header: 'Email', 
     dataIndex: 'email', 
     flex: 1 
    }, { 
     header: "Password", 
     flex: 1, 
     dataIndex: 'pass', 
     xtype: 'widgetcolumn', 
     widget: { 
      xtype: 'textfield', 
      itemId: 'password', 
      inputType: 'password', 
      readOnly: true 
     } 
    }], 
    selType: 'rowmodel', 
    height: 300, 
    width: '100%', 
    renderTo: Ext.getBody(), 
    doChangeInputType: function (passwordField) { 
     var inputDom = Ext.get(passwordField.getInputId()).dom, 
      type = inputDom.type; 
     inputDom.type = type == "text" ? 'password' : 'text'; 
    } 
}); 

Answer 2

私はそれがエンドユーザーにGUIに表示されたパスワードを復号化していることが有効だ状況を考えることはできません。