Extjを使用してMessage.boxにラベルを追加するには

Question

テキスト領域に書き込む文字の長さを示すラベルを追加します。あなたはtextareafieldを指定する必要がありますので、どのように私はここEXT.Message.Box にラベルを追加することができ、コード...

function UnLockRemarkWindow(a) { 

    var c = Ext.MessageBox.show({ 
     title: "Version Remarks", 
     inputType: "textarea", 
     msg: "Please Enter Version Remarks:", 
     width: 375, 
     buttons: Ext.MessageBox.OKCANCEL, 
     multiline: true, 
     fn: b, 
     icon: Ext.MessageBox.INFO, 
     modal: true, 
     closable: false, 
     allowBlank: false 

    }); 

    c.textField.inputEl.dom.type = "textarea"; 

、ここでは、私が欲しい画像がこの

Answer 1

のようなものですされており、 labelのitemsこれを実現するメッセージボックスの設定です。つまり、テキストエリアとラベルをメッセージボックスの子として定義する必要があります。

実施例：

Ext.application({ 
 
    launch : function() { 
 
     var c = Ext.Msg.show({ 
 
     title: "Version Remarks", 
 
     items:[ 
 
      { 
 
      xtype:'textareafield', 
 
      labelWrap:true, 
 
      label: "Please Enter Version Remarks:", 
 
      
 
     }, 
 
     { 
 
      xtype:'label', 
 
      html:'0 of 500', 
 
      height:20, 
 
      style:{ 
 
       textAlign:'right', 
 
       background:'white' 
 
      } 
 
      }, 
 
      ], 
 
     
 
     width: 375, 
 
     buttons: Ext.MessageBox.OKCANCEL, 
 
     multiline: true, 
 
     
 
     icon: Ext.MessageBox.INFO, 
 
     modal: true, 
 
     closable: false, 
 
     allowBlank: false 
 

 
    }); 
 
    } 
 
});

<link rel="stylesheet" href="https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css"> 
 
<script type="text/javascript" src="https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all-debug.js"></script>

内線4溶液：これは、MessageBoxによって達成することができない 。 itemsウィンドウの設定で textareafieldと labelを指定するには、を使用する必要があります。

作業例：

Ext.application({ 
 
    name : 'Fiddle', 
 

 
    launch : function() { 
 
     Ext.create('Ext.window.Window', { 
 
    title: "Version Remarks", 
 
     items:[ 
 
      { 
 
      xtype:'textareafield', 
 
      width:'100%', 
 
      fieldLabel: "Please Enter Version Remarks:", 
 
      
 
     }, 
 
     { 
 
      xtype:'label', 
 
     text:'0 of 500', 
 
      height:20, 
 
      width:'100%', 
 
      style:{ 
 
       textAlign:'right', 
 
       display:'block' 
 
      } 
 
      }, 
 
      ], 
 
     
 
     width: 375, 
 
     buttonAlign : 'center', 
 
     buttons:[ { 
 
      text:'OK' 
 
     }, 
 
     { 
 
      text:'Cancel' 
 
     }], 
 
     modal: true, 
 
     closable: false, 
 
}).show(); 
 
    } 
 
});

<link rel="stylesheet" href="https://cdn.sencha.com/ext/gpl/4.1.1/resources/css/ext-all.css"> 
 
<script type="text/javascript" src="https://cdn.sencha.com/ext/gpl/4.1.1/ext-all-debug.js"></script>

Answer 2

私はExtJSのバージョン4.1を使用していますが、ここではスクリーンショットが