1. Ext.Msg.alert 基本警报框
    标题+提示内容

     Ext.Msg.alert('title', 'message here')
    

    运行结果:
    image.png

  2. Ext.MessageBox.confirm 确认框
    不支持修改按钮文字

    Ext.MessageBox.confirm('Confirm', 'Are you sure?', callbackFunction)
                   function callbackFunction(btn) {
                     if(btn === 'yes') {
                       Ext.Msg.alert('yes', 'you clicked yes')
                     }else {
                       Ext.Msg.alert('no', 'you clicked no')
                     }
                   }

    运行结果:
    image.png
    image.png
    image.png

  3. 提示框 prompt
    提示用户输入
<!DOCTYPE html>
<html>
    <head>
        <link
            href="./ext-6.0.0-gpl/ext-6.0.0/build/classic/theme-classic/resources/theme-classic-all.css"
            rel="stylesheet"
        />
        <script src="./ext-6.0.0-gpl/ext-6.0.0/build/ext-all.js"></script>
        <script type="text/javascript">
            Ext.onReady(function () {
                Ext.create('Ext.Button', {
                  renderTo: Ext.getElementById('formID'),
                  text: 'Click me',
                  listeners: {
                    click: function() {
                      Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text) {
                        if(btn == 'ok') {
                          Ext.Msg.alert('Hello', 'Hello' + text)
                        }
                      }, this, {
                        multiline: true //设置多行
                      })
                    }
                  }
                })
            });
        </script>
    </head>
    <body>
        <div id="formID"></div>
    </body>
</html>

运行结果:
image.png

  1. 多行文本输入框
    Ext.MessageBox.show
Ext.MessageBox.show({
   title: 'Details',
   msg: 'Please enter your details:',
   width:300,
   buttons: Ext.MessageBox.OKCANCEL, //Ext.MessageBox.YESNOCANCEL
   multiline: true,  // this property is for multiline user input.
   fn: callbackFunction
});

零号
1 声望0 粉丝

引用和评论

0 条评论