我如何使用 Extjs 在 Message.box 中添加标签

Question

我想添加标签来显示我在文本区域中写入的字符长度。那么，如何在 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

您需要在消息框的 items 配置中指定 textareafield 和 label 来实现此目的，即您需要将 textarea 和 label 定义为消息框的子项。

一个工作示例：

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>

Ext 4 解决方案： MessageBox无法实现。我们需要使用 Ext.window 来实现这一点并在 window.

的 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 版，这是屏幕截图

我如何使用 Extjs 在 Message.box 中添加标签

How do i add label in Message.box using Extjs

extjs

sencha-touch