一:Alert
      Alert组件最简单的用法就是直接弹出一个消息提示框:
protected void Button_Click(object sender, AjaxEventArgs e)
{
    Ext.Msg.Alert("标题内容", "消息内容").Show();
}

如果我们需要在弹出的提示框点了“确定”以后要执行其他操作怎么办呢?这时候可以使用Alert方法的重载方法,通过JFunction指定一个客户端方法,点了“确定”后就指定相应的客户端JavaScript方法,使用如下:
protected void Button_Click(object sender, AjaxEventArgs e)
{
    Ext.Msg.Alert("标题内容", "消息内容", new JFunction { Fn ="JsMethod" }).Show();
}
<ext:Button ID="Button1" runat="server" Text="Submit">
<AjaxEvents>
<Click OnEvent="Button_Click"></Click>
</AjaxEvents>
</ext:Button>
<script type="text/javascript">
function JsMethod() {
        alert("Client JsMethod");
    }
</script>

Coolite Toolkit还为Alert提供了四中图标UI效果,他们分别是问题(Question)、警告(Warning)、错误(Error)和信息(Informational),使用不同的参数将构建出不同的Alert显示风格。使用方法如下:
protected void Button_Alert(object sender, AjaxEventArgs e)
{
    Ext.Msg.Show(new MessageBox.Config
    {
        Title ="图标提示框",
        Message ="这个框带个图标",
        Buttons = MessageBox.Button.OK,
        Icon = MessageBox.Icon.INFO,
        AnimEl =this.btnAlert.ClientID
    });
}
      图标的取值可以直接通过MessageBox.Icon枚举设置,分别定义有:NONE、ERROR、INFO、QUESTION和WARNING。
                  

除了上面的应用外,还可以通过Message.ButtonConfigs来配置Alert的高级应用,比如配置确认对话框,根据不同选择执行不同的AjaxMethod方法(下面代码里的NS为通过ScriptManager指定的客户端名称空间,其功能等同于Coolite.AjaxMethods)。
protected void Button_Click(object sender, AjaxEventArgs e)
{
    Ext.Msg.Alert("标题内容", "消息内容", new MessageBox.ButtonsConfig
    {
        Yes =new MessageBox.ButtonConfig
        {
            Handler ="NS.DoYes()",
            Text ="确定"
        },
        No =new MessageBox.ButtonConfig
        {
            Handler ="NS.DoNo()",
            Text ="取消"
        }
    }).Show();
}

[AjaxMethod]
public void DoYes()
{
    Ext.Msg.Alert("操作提示", "你刚刚点了-确定").Show();
}

[AjaxMethod]
public void DoNo()
{
    Ext.Msg.Alert("操作提示", "你刚刚点了-取消").Show();
}

                  
注:点了“确定”后直接执
行服务端的另一方法没有实现出来,还望实现过的朋友指点,谢谢。

二:Confirm
      上面通过Coolite Toolkit的扩展功能将Alert组件实现了Confirm的效果,其实Confirm自身的功能也是非常强大的,同Alert一样,最简单的使用则是直接弹出确认对话框。
protected void Button_Confirm(object sender, AjaxEventArgs e)
{
    Ext.Msg.Confirm("操作提示", "消息内容").Show();
}

如果要知道是点击了那一个操作按扭,则同样可以通过JFunction指定一个客户端的JavaScript方法用来接收操作结果。
protected void Button_Confirm(object sender, AjaxEventArgs e)
{
    Ext.Msg.Confirm("操作提示", "消息内容",
        new JFunction
        {
            Fn ="ShowResult"
        }).Show();
}
<ext:Button ID="btnConfirm" runat="server" Text="Confirm">
<AjaxEvents>
<Click OnEvent="Button_Confirm"></Click>
</AjaxEvents>
</ext:Button>
<script type="text/javascript">
function ShowResult(btn) {
        Ext.Msg.alert("你刚刚点了按扭:"+ btn);
    }
</script>
      Confirm同样也可以定制根据操作调用AjaxMethod,实现方式和本文前面的Alert实现方式一样。

三:Prompt
      Prompt可应用于简单的是数据录入,Coolite Toolkit里的服务端Prompt使用非常简单,同上面Alert和Confirm一样通过JFunction指定客户端方法处理操作结果。
protected void Button_Prompt(object sender, AjaxEventArgs e)
{
    Ext.Msg.Prompt("数据录入", "请在下面录入数据",
        new JFunction
        {
            Fn ="showResultText"
        }).Show();
}
<ext:Button ID="btnPrompt" runat="server" Text="Prompt">
<AjaxEvents>
<Click OnEvent="Button_Prompt"></Click>
</AjaxEvents>
</ext:Button>
<script type="text/javascript">
function showResultText(button,text) {
        alert("你录入的数据为:"+ text);
    }
</script>

以上实现的是单行的Prompt,Coolite Toolkit也提供了多行支持,使用如下:
protected void Button_Prompt(object sender, AjaxEventArgs e)
{
    Ext.Msg.Show(new MessageBox.Config
    {
        Title ="数据录入",
        Message ="请在下面录入数据:",
        Width =300,
        Buttons = MessageBox.Button.OKCANCEL,
        Multiline =true,
        AnimEl =this.btnPrompt.ClientID,
        Fn =new JFunction { Fn ="showResultText" }
    });
}
            
      上图效果主要是通过Ext.Msg.Show()方法,通过该方法还可以定制许多我们需要的UI效果,比如说定制一个进度条效果,其实现为如下代码片段:
protected void Button_Wait(object sender, AjaxEventArgs e)
{
    Ext.Msg.Show(new MessageBox.Config
    {
        Title ="请等待",
        Message ="系统正在加载,请等待",
        ProgressText ="系统加载中",
        Width =300,
        Progress =true,
        Closable =false,
        AnimEl =this.btnWait.ClientID
    });
    this.StartLongAction();
}
private void StartLongAction()
{
    this.Session["Task1"] =0;
    ThreadPool.QueueUserWorkItem(LongAction);

this.TaskManager1.StartTask("Task1");
}
private void LongAction(object state)
{
    for (int i =0; i <10; i++)
    {
        Thread.Sleep(1000);
        this.Session["Task1"] = i +1;
    }
    this.Session.Remove("Task1");
}
protected void RefreshProgress(object sender, AjaxEventArgs e)
{
    object progress =this.Session["Task1"];
    if (progress !=null)
    {
        Ext.MessageBox.UpdateProgress(((int)progress) / 10f, "");
    }
    else
    {
        this.TaskManager1.StopTask("Task1");
        Ext.MessageBox.Hide();
        this.ScriptManager1.AddScript("ProgressResult();");
    }
}

<ext:Button ID="btnWait" runat="server" Text="Wait">
    <AjaxEvents>
        <Click OnEvent="Button_Wait"></Click>
    </AjaxEvents>
</ext:Button>
<ext:TaskManager ID="TaskManager1" runat="server">
<Tasks>
    <ext:Task
        TaskID="Task1"
        Interval="1000"
        AutoRun="false">
        <AjaxEvents>
            <Update OnEvent="RefreshProgress"/>
        </AjaxEvents>                    
    </ext:Task>
</Tasks>
</ext:TaskManager>
<script type="text/javascript">
function ProgressResult()
{
    alert("进度条走完了");
}
</script>

注:以上内容源于官方文档和示例整理而成,笔记于此愿与有志者共同学习交流。

转载于:https://www.cnblogs.com/hendy/archive/2010/04/12/1710277.html

Coolite(二)服务器端Alert,Confirm,Prompt相关推荐

  1. 模拟alert,confirm,prompt

    以前项目上用的那个虽然也是自己写的,但是是基于JQ的,前不久看到人人网出的JS有道考题和这个很像,所以就用原生JS重写了一遍: JS (function(win){var tips = {'title ...

  2. Python+Selenium UI自动化 - alert/confirm/prompt窗口处理方法

    WebDriver中处理原生JS的alert.confirm以及prompt非常方便,三种弹出窗口均无法直接通过页面元素定位,不关闭窗口无法在页面上做其他操作 语法:         text:返回a ...

  3. jQuery Alert Dialogs (Alert, Confirm, Prompt Replacements)(翻译)

    前不久在官方网站是看见这个插件,所以今天趁有空就看了一下,随便给大家共享一下.也许你早已知道了 ,如果是这样那请跳过,不要拍砖. 这个Jquery插件的目的是替代JavaScript的标准函数aler ...

  4. JavaScript弹出对话框的三种方式-alert()-confirm()-prompt()

    一.alert()警告框(确定) alert()方法是显示一条弹出提示消息和确认按钮的警告框. 需要注意的是 : alert()是一个阻塞的函数,如果不点确认按钮,后面的内容就不会加载出来. 使用方式 ...

  5. JS的三种消息提示框alert confirm prompt

    首先来看看alert的效果: 代码为: $(function(){$("#quit").click(quit); })function quit(){alert("消息提 ...

  6. html对话框跳转页面,html页面的简单对话框(alert, confirm, prompt)

    html页面简单的三种对话框如下: 1.alert(),最简单的提示框: alert("你好!"); 2.confirm(),有确认和取消两个按钮: if(confirm(&quo ...

  7. cefsharp重写默认js弹窗(alert/confirm/prompt)

    1.设置js弹窗控制器 webView.JsDialogHandler = this;  //js弹窗控制 this表示本类对象,所以本类要实现IJsDialogHandler接口 2.实现IJsDi ...

  8. webdriver之select、alert、prompt、confirm

    select_by_index()  :通过索引定位 select_by_value()  :通过value值定位 select_by_visible_text() :通过文本值定位 deselect ...

  9. Dorado7 notify非alert 输入框prompt confirm layer dialoger,layer.msg,toast效果,几秒关闭layer.load layer.open

    IDEA-layer 方式一:layer.alert() layer.alert("当前行的下标:" + row.username, {icon: 0}); icon=0 1 2 ...

最新文章

  1. 第四周项目一-求四个数的最大公约数
  2. linux文件系统中文件基本权限,Linux文件权限基本属性图文详解
  3. 最近微软购买了哪些域名?
  4. LeetCode_数组_中等题
  5. Chrome浏览器和百度搜索引擎兼容度不佳
  6. oraclde存储过程_Oracle存储过程详解(引用)+补充
  7. ubunt16.04 安装3090显卡驱动 cuda cudnn pytorch
  8. Windows Phone 7三触控程序开发
  9. cassandra vs mongo (1)存储引擎
  10. 新东方雅思词汇---10.1、(a)esthet
  11. 用matlab开环增益,自控原理实验仿真部份
  12. C++(18)——温度表达转化
  13. vue手机端打开高德地图app
  14. 微信小程序--简约加载动画合集
  15. Sencha Cmd 优化 Sencha Ext JS/7.5.12
  16. Xiuno 简约白色主题
  17. 软件缺陷静态分析CodeSonar
  18. Kaggle账号注册时验证码无法显示问题解决方法
  19. 【渝粤题库】陕西师范大学200171 西方文论 作业
  20. 安卓 jni 开发之 native 方法的动态注册

热门文章

  1. hashmap移除元素_Java HashMap 如何正确遍历并删除元素的方法小结
  2. Java接受带文件的表单_Javaweb使用getPart接收表单文件过程解析
  3. java 实现动画_java编程加载窗口,实现动画
  4. JMS学习(1):MS基本概念
  5. JAVA 编程开发入门-张晨光-专题视频课程
  6. 怎样把java换主题_如何为Eclipse安装主题(Color Theme)
  7. 分块编码(Transfer-Encoding:chunked)
  8. 08-数组中常用的属性及方法
  9. trident API指南
  10. spark RDD详解及源码分析