介绍Dev系列控件在前台也就是客户端的一些常用方法介绍以及前后台异步通信的方法。

一.Dev Data Edit控件通用属性以及方法:

属性

1.GetEnabled():返回控件是否为可操作状态

2.GetText():返回控件的Text的值

3.SetEnabled():设置控件状态

4.GetValue():返回控件的Value

5.SetValue():设置控件的Value

注意:在客户端进行Dev控件编程必须为Dev控件指定一个客户端的名称即ClientInstanceName,客户端直接根据ClientInstanceName来进行相关的

操作。一个简单的例子来从客户端改变AspxTextBox的值

Code

<head runat="server">

<title>ClientTest</title>

<script language="javascript" type="text/javascript">

function onSendText(s,e){

//得到AspxTextBox1的值

var txt=txtSend.GetText();

//根据AspxTextBox1的值设置AspxTextBox2的值

var sendtxt="Get "+ txt+" from Client";

txtGet.SetText(sendtxt);

}

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<dxe:ASPxTextBox ID="ASPxTextBox1" runat="server" Width="170px" ClientInstanceName="txtSend" ClientEnabled="true">

</dxe:ASPxTextBox>

<dxe:ASPxButton ID="ASPxButton1" runat="server" Text="Post" AutoPostBack="False" ClientInstanceName="btnSend">

<ClientSideEvents Click="function(s, e) {

onSendText(s,e);

}" />

</dxe:ASPxButton>

<dxe:ASPxTextBox ID="ASPxTextBox2" runat="server" Width="170px" ClientInstanceName="txtGet" ClientEnabled="true" >

</dxe:ASPxTextBox>

</div>

</form>

</body>

运行效果如下图:

怎么样?是不是和ASP.NET AJAX有异曲同工之妙。

接下来,第二个例子,ASPXComBox下拉框无刷新连动

当然,已经有很多种方法,AJAX插件来实现下拉框的级联连动更新。Dev的下拉框也不例外。在介绍这个例子之间,首先节点介绍下Dev的控件是如何

实现客户端,服务端异步通信的。

从客户端到服务端的通信:PerformCallback()。PerformCallback就是从客户端到服务端的桥梁,它是单向的只能从客户端发起到服务端。在Perform

Callback()括号当中我们可以传递一些参数到服务器端,从而达到更新效果。

服务器端的接受并异步刷新:Callback()。当从服务端PerformCallback唤醒以后,响应的控件Callback事件开始执行(控件的服务器事件中可以找到)。

并且通过Parameter键值来获取从客户端传过来的值进行相关的处理。

客户端:

Code

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title>PerTest</title>

<script language="javascript" type="text/javascript">

//客户端处理下拉框选择项改变事件,client端aspxcombox下拉框改变事件为SelectedIndexChanged

function OnEmployeesChanged(s){

//PerformCallback事件实际上时dev系列控件客户端服务器端异步通信的"大使",通过PerfromCallback事件

//将客户端的通信要求传递给服务端,在服务端通过控件的callback事件来接受相关参数并进行页面异步刷新

devcbxChi.PerformCallback(s.GetValue());

}

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<dxe:ASPxComboBox runat="server" ID="devcbxPar2" DropDownStyle="DropDownList" EnableIncrementalFiltering="True"

EnableSynchronization="False" ClientInstanceName="devcbxPar2"

Width="160px">

<ClientSideEvents SelectedIndexChanged="function(s, e) { OnEmployeesChanged(s); }"></ClientSideEvents>

</dxe:ASPxComboBox>

<dxe:ASPxComboBox runat="server" ID="devcbxChi" DropDownStyle="DropDownList" EnableIncrementalFiltering="True"

EnableSynchronization="False" ClientInstanceName="devcbxChi"

Width="160px" oncallback="devcbxChi_Callback">

</dxe:ASPxComboBox>

</div>

</form>

</body>

</html>

服务端:

Code

using DevExpress.Web.ASPxEditors;

Code

SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["northwind"].ConnectionString);

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

devcbxPar2.Items.Clear();

string selectSQL = "select EmployeeID,FirstName from Employees";

SqlDataAdapter SDA = new SqlDataAdapter(selectSQL, conn);

DataSet DS = new DataSet();

SDA.Fill(DS);

for (int i = 0; i < DS.Tables[0].Rows.Count; i++)

{

devcbxPar2.Items.Add(new ListEditItem(DS.Tables[0].Rows[i]["FirstName"].ToString().Trim(), DS.Tables[0].Rows[i]["EmployeeID"]

.ToString().Trim()));

}

}

}

protected void devcbxChi_Callback(object source, DevExpress.Web.ASPxClasses.CallbackEventArgsBase e)

{

//得到从客户端传递过来的参数来进行异步通信响应

string parm = e.Parameter.Trim();

string selectSQL = "select TerritoryID from EmployeeTerritories where EmployeeID='" + parm + "'";

SqlDataAdapter SDA = new SqlDataAdapter(selectSQL, conn);

DataSet DS = new DataSet();

SDA.Fill(DS);

devcbxChi.Items.Clear();

for (int i = 0; i < DS.Tables[0].Rows.Count; i++)

{

devcbxChi.Items.Add(DS.Tables[0].Rows[i]["TerritoryID"].ToString().Trim());

}

devcbxChi.SelectedIndex = 0;

}

OK,一个简单的异步刷新下拉框连动实现。那么思索下dev控件的异步通信,既然这么容易能实现从客户端服务端的异步刷新,那么要求再高点,

怎样通过服务端的发起来异步改变客户端的元素呢?我们把上面的程序稍微改下

Code

<head runat="server">

<title>PerTest</title>

<script language="javascript" type="text/javascript">

//客户端处理下拉框选择项改变事件,client端aspxcombox下拉框改变事件为SelectedIndexChanged

function OnEmployeesChanged(s){

//PerformCallback事件实际上时dev系列控件客户端服务器端异步通信的"大使",通过PerfromCallback事件

//将客户端的通信要求传递给服务端,在服务端通过控件的callback事件来接受相关参数并进行页面异步刷新

devcbxChi.PerformCallback(s.GetValue());

}

function onEndCallback(s,e){

var result=s.cp_result;

txtresult.SetText(result);

}

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<dxe:ASPxComboBox runat="server" ID="devcbxPar2" DropDownStyle="DropDownList" EnableIncrementalFiltering="True"

EnableSynchronization="False" ClientInstanceName="devcbxPar2"

Width="160px">

<ClientSideEvents SelectedIndexChanged="function(s, e) { OnEmployeesChanged(s); }"></ClientSideEvents>

</dxe:ASPxComboBox>

<dxe:ASPxComboBox runat="server" ID="devcbxChi" EnableIncrementalFiltering="True"

EnableSynchronization="False" ClientInstanceName="devcbxChi"

Width="160px" oncallback="devcbxChi_Callback" ValueType="System.String">

<ClientSideEvents EndCallback="function(s, e) {

onEndCallback(s,e);

}" />

</dxe:ASPxComboBox>

<dxe:ASPxTextBox ID="ASPxTextBox1" runat="server" Width="170px"

ClientInstanceName="txtresult" ForeColor="Red">

</dxe:ASPxTextBox>

</div>

</form>

</body>

服务端:

Code

protected void devcbxChi_Callback(object source, DevExpress.Web.ASPxClasses.CallbackEventArgsBase e)

{

//得到从客户端传递过来的参数来进行异步通信响应

string parm = e.Parameter.Trim();

string selectSQL = "select TerritoryID from EmployeeTerritories where EmployeeID='" + parm + "'";

SqlDataAdapter SDA = new SqlDataAdapter(selectSQL, conn);

DataSet DS = new DataSet();

SDA.Fill(DS);

devcbxChi.Items.Clear();

for (int i = 0; i < DS.Tables[0].Rows.Count; i++)

{

devcbxChi.Items.Add(DS.Tables[0].Rows[i]["TerritoryID"].ToString().Trim());

}

devcbxChi.SelectedIndex = 0;

//定义JSProperties参数值回传给客户端

devcbxChi.JSProperties["cp_result"] = "更新成功";

}

看看效果:。没错"更新成功"是从服务端回传给了客户端!是不是很简单?一个重要的属性JSProperties

JSProperties属性可以从服务端的参数传到客户端。我们可以定义很多个参数,但是在定义JSProperties属性的参数时,一定要记得参数

的值以"cp"开头,以此来与Dev的基类区别开来。接下来我们在控件的客户端EndCallback()事件来接受JSProperties的参数来进行相关

的设置。

Dev的Data Edit相关控件的客户端编程也非常强大,让我们非常轻松的就可以实现异步通信。将Dev的客户端,服务端编程相结合,我们

的程序将效率更高,实现效果也更好。

Dev系列控件的AJAX (转)的更多相关文章

  1. Dev系列控件的AJAX使用Demo

    一.Dev Data Edit控件通用属性以及方法: 属性 1.GetEnabled():返回控件是否为可操作状态 2.GetText():返回控件的Text的值 3.SetEnabled():设置控 ...

  2. jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法

    博客分类: jquery-easyui jQueryAjax框架HTML  现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...

  3. asp.net2.0安全性(4)--Login系列控件--转载来自车老师

    前面主要说了与安全相关的一系列的类,现在我们使用这些类就可以做出我们自己的安全系统了.其实微软的目的远不至于此,下面我们就来看一下微软为我们提供的Login系列控件. Login系列控件是微软为了简化 ...

  4. dev的控件放在没有runat="server"的标签中,回调出现的问题

    dev的控件放在没有runat="server"的标签中,第一次回调是会刷新页面, 有runat="server"时不会刷新页面

  5. ASP.NET Dev ASPxGridView控件使用 ASP.NET水晶报表打印

    1.ASPxGridView控件使用 2.ASP.NET水晶报表客户端打印 3.javascript打印 4.ASPxGridView根据Textbox查询 5. ASPxGridView 列宽 1. ...

  6. WPF系列 —— 控件添加依赖属性(转)

    WPF系列 —— 控件添加依赖属性 依赖属性的概念,用途 ,如何新建与使用.本文用做一个自定义TimePicker控件来演示WPF的依赖属性的简单应用. 先上TimePicker的一个效果图. 概念 ...

  7. Windows高DPI系列控件(一) - 饼图

    目录 一.醉一醉 二.效果展示 三.高DPI适配 1.高DPI框架运作 2.适配高DPI 3.适配饼图 四.相关文章 原文链接:Windos高DPI系列控件(一) - 饼图 一.醉一醉 眨眼功夫,20 ...

  8. Windows高DPI系列控件(二) - 柱状图

    目录 一.QCP 二.效果展示 三.高DPI适配 1.自定义柱状图 2.新的柱状图 3.测试代码 四.相关文章 原文链接:Windows高DPI系列控件(二) - 柱状图 一.QCP QCP全称QCu ...

  9. 在Visualforce page中用自带的控件实现Ajax回调后台方法(并且可以用js去动态给parameters赋值)

    这里用的组合是:apex:commandLink  + apex:actionFunction + apex:outputPanel 这里的 apex:commandLink 和 apex:actio ...

随机推荐

  1. JavaScript 函数作用域和闭包

    函数作用域和闭包  词法作用域   它们在定义它们的作用域里运行,而不是在执行的作用域运行,但是只有在运行时,作用域链中的属性才被 定义(调用对象),此时,可访问任何当前的绑定.   调用对象     ...

  2. Eclipse读取xml中文乱码问题解决

    解决eclipse读取xml时中文乱码报错问题 在eclipse.ini中加入下而一行 -Dfile.encoding=UTF-8

  3. swing菜单,常用组件,常用容器

    1菜单 import javax.swing.*; import java.awt.*; import java.awt.event.InputEvent; import java.awt.event ...

  4. [转]extern,static存储空间矛盾

    其实,这两个语句的位置不同,会出现不同的解释.这主要是由于 static 具有的两重意义所导致的: (1) 如果 static int foo; 这一句位于函数中,则 static 表示的是存储属性, ...

  5. php中JPGraph入门配置与应用

    什么是PHP JPGraph? 专门提供图表的类库.它使得作图变成了一件非常简单的事情.生成非美工人士生成的图表.二维码算法. 到官方网站下载. docportal 帮助手册 src 包含主要代码. ...

  6. 你不知的IE的bug及其解决方案

    E令人咬牙切齿的bug不胜枚举,其中IE6更是臭名昭著,令人发指.这里总结出IE下最为严重的5个bug,及其应对方案. 1.IE6下无法显示png格式的透明信息 这个bug是众多网页设计师的噩梦,虽然 ...

  7. php计算剩余时间的自定义函数

    把两个日期格式的字符串转化成unix时间戳,然后相减获得时间戳差,最后判断剩余时间,生成类似(2小时30分钟20秒前发布)这样的时间格式,代码如下: function gettime($time_s, ...

  8. Mssql显错和不显错模式下的注入

    Title:Mssql显错和不显错模式下的注入 -- 2010-10-27 19:51 近期用手工注入用习惯了,便列出最近用的Mssql语句,以后方便拿来用! -------------------- ...

  9. Large sum

    聪明的办法是想:求前10位,那只要前8位加起来,进2位就OK. 本的办法,就是真的加起来,截前面10位.如我. numList = str.split() sum = 0 for i in range ...

  10. [LeetCode 109] - 将已排序链表转换为二叉搜索树 (Convert Sorted List to Binary Search Tree)

    问题 给出一个元素以递增序列排序的单链表,将其转换为一棵高度平衡的二叉搜索树. 初始思路 二叉搜索树高度平衡,意味着左右子树的高度要平衡.根据二叉树左子树节点小于根节点,右子树节点大于根节点的性质:我 ...