早听说magicajax是如何如何的简单,这几天总算见识到了,和以前写程序没多大区别,只要将控件包含在ajaxpanel里就OK了
源码下载: Files\huazi4995\magicajax-0.2.2-source.rar
在公司写了一个关于这个框架的应用页面,也将其源吗码编译成了支持中文的,好爽 .如下图
<%@ Register TagPrefix="ajax" Namespace="MagicAjax.UI.Controls" Assembly="MagicAjax" %>
<%@ Page language="c#" Codebehind="ZiDian.aspx.cs" AutoEventWireup="false" Inherits="LSA.ActiveForm.ZiDian" ResponseEncoding="utf-8" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>代码类别选择</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<LINK href="../Style/WinXP/style.css" type="text/css" rel="stylesheet">
<base target="_self">
<style type="text/css">.btn_2k3 { BORDER-RIGHT: #002d96 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #002d96 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#9DBCEA); BORDER-LEFT: #002d96 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #002d96 1px solid }
.btn { BORDER-RIGHT: #7b9ebd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7b9ebd 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde); BORDER-LEFT: #7b9ebd 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #7b9ebd 1px solid }
</style>
<script language="javascript">
function getvalue()
{
var a=document.getElementById("txtDm").value;
alert(a);
}
function returnData(dm,mc)
{
var strReturn="";
strReturn=strReturn + dm + "," + mc;
window.returnValue = strReturn;
window.close();
//var objList=document.getElementById("lst");
//objList.options[0].value = strValue;
//objList.options[0].text = strText;
}
function btncanel()
{
window.close();
}
//删除
function deleteOption()
{
var addOption=document.createElement("option");
var index1;
//alert(addOption);
if(document.Form1.lst.length==0)
return(false);
index1=document.Form1.lst.selectedIndex;
if(index1<0)
{
alert("请先选择!!!");
return(false);
}
addOption.text=document.Form1.lst.options(index1).text;
addOption.value=document.Form1.lst.value;
//document.Form1.lst_TeZheng.add(addOption);
document.Form1.lst.remove (index1);
}
function SetValue()
{
//var objList = document.getElementById("lst");
//if(!(objList.length <%=num%>))
//{
// alert("输入的待选项验证失败,应 <%=num%> 。");
// return;
//}
var strReturn="";
var objList = document.getElementById("lst");
for(var i=0;i<objList.length;i++)
{
//返回给文本框
//strReturn = strReturn + "," + objList.options[i].text;
//返回给多选框
strReturn = strReturn + "|" + objList.options[i].value + "," + objList.options[i].text;
}
if(strReturn !="")
strReturn = strReturn.substring(1,strReturn.length);
window.returnValue = strReturn;
window.close();
}
function KeyDown(){
//alert(event.keyCode);
if (event.keyCode==191){
//alert('123123');
event.keyCode=0; event.returnValue=false;
}
}
</script>
</HEAD>
<body MS_POSITIONING="FlowLayout">
<form id="Form1" method="post" runat="server">
<FONT face="宋体"></FONT>
<br>
<br>
<center>
<ajax:ajaxpanel id="AjaxPanel1" runat="server">
<TABLE id="Table1" cellSpacing="4" cellPadding="4" width="340" border="1">
<TR>
<TD><FONT face="宋体">关键字:</FONT>
<asp:TextBox id="txtDm" runat="server" ToolTip="输入代码或拼音首字母索引" Width="70px"></asp:TextBox>
<asp:LinkButton id="lbShowResult" runat="server">搜 索</asp:LinkButton></TD>
<TD>
<asp:Button id="btnPre" runat="server" CssClass="btn" Text="前一页"></asp:Button>
<asp:Button id="btnNext" runat="server" CssClass="btn" Text="下一页"></asp:Button></TD>
</TR>
<TR>
<TD colSpan="2">
<asp:DataGrid id="dg" runat="server" ToolTip="双击可以选择" Width="100%" AllowPaging="True" AutoGenerateColumns="False"
ShowHeader="False" DataKeyField="dm">
<Columns>
<asp:TemplateColumn>
<HeaderStyle Width="10px"></HeaderStyle>
<HeaderTemplate>
<INPUT id="checkAll" type="checkbox" CommandName="Select2">
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox id="chk" runat="server" AutoPostBack="True"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<HeaderStyle Width="10px"></HeaderStyle>
<ItemTemplate>
<asp:RadioButton id="rad" runat="server" AutoPostBack="True"></asp:RadioButton>
</ItemTemplate>
</asp:TemplateColumn>
<asp:ButtonColumn Visible="False" Text="选择" CommandName="Select">
<HeaderStyle Width="10px"></HeaderStyle>
</asp:ButtonColumn>
<asp:BoundColumn DataField="dm">
<HeaderStyle Width="20px"></HeaderStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="name">
<HeaderStyle Width="200px"></HeaderStyle>
</asp:BoundColumn>
</Columns>
<PagerStyle Visible="False" Mode="NumericPages"></PagerStyle>
</asp:DataGrid></TD>
</TR>
<TR>
<TD id="tddrp" style="HEIGHT: 67px" align="center" colSpan="2" runat="server">
<asp:ListBox id="lst" runat="server"></asp:ListBox><INPUT id="btndelete" style="DISPLAY: none" onclick="javascript:deleteOption();" type="button"
value="删 除">
<asp:Button id="btndel" runat="server" CssClass="btn" Text="删 除"></asp:Button></TD>
</TR>
<TR>
<TD id="tdbtn" align="center" colSpan="2" runat="server"><INPUT class="btn" onclick="SetValue();" type="button" value="确 定">
<INPUT class="btn" id="btncanel" onclick="javascript:window.close();" type="button" value="取 消">
</TD>
</TR>
</TABLE>
</ajax:ajaxpanel>
</center>
</form>
</body>
</HTML>
<%@ Page language="c#" Codebehind="ZiDian.aspx.cs" AutoEventWireup="false" Inherits="LSA.ActiveForm.ZiDian" ResponseEncoding="utf-8" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>代码类别选择</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<LINK href="../Style/WinXP/style.css" type="text/css" rel="stylesheet">
<base target="_self">
<style type="text/css">.btn_2k3 { BORDER-RIGHT: #002d96 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #002d96 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#9DBCEA); BORDER-LEFT: #002d96 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #002d96 1px solid }
.btn { BORDER-RIGHT: #7b9ebd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7b9ebd 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde); BORDER-LEFT: #7b9ebd 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #7b9ebd 1px solid }
</style>
<script language="javascript">
function getvalue()
{
var a=document.getElementById("txtDm").value;
alert(a);
}
function returnData(dm,mc)
{
var strReturn="";
strReturn=strReturn + dm + "," + mc;
window.returnValue = strReturn;
window.close();
//var objList=document.getElementById("lst");
//objList.options[0].value = strValue;
//objList.options[0].text = strText;
}
function btncanel()
{
window.close();
}
//删除
function deleteOption()
{
var addOption=document.createElement("option");
var index1;
//alert(addOption);
if(document.Form1.lst.length==0)
return(false);
index1=document.Form1.lst.selectedIndex;
if(index1<0)
{
alert("请先选择!!!");
return(false);
}
addOption.text=document.Form1.lst.options(index1).text;
addOption.value=document.Form1.lst.value;
//document.Form1.lst_TeZheng.add(addOption);
document.Form1.lst.remove (index1);
}
function SetValue()
{
//var objList = document.getElementById("lst");
//if(!(objList.length <%=num%>))
//{
// alert("输入的待选项验证失败,应 <%=num%> 。");
// return;
//}
var strReturn="";
var objList = document.getElementById("lst");
for(var i=0;i<objList.length;i++)
{
//返回给文本框
//strReturn = strReturn + "," + objList.options[i].text;
//返回给多选框
strReturn = strReturn + "|" + objList.options[i].value + "," + objList.options[i].text;
}
if(strReturn !="")
strReturn = strReturn.substring(1,strReturn.length);
window.returnValue = strReturn;
window.close();
}
function KeyDown(){
//alert(event.keyCode);
if (event.keyCode==191){
//alert('123123');
event.keyCode=0; event.returnValue=false;
}
}
</script>
</HEAD>
<body MS_POSITIONING="FlowLayout">
<form id="Form1" method="post" runat="server">
<FONT face="宋体"></FONT>
<br>
<br>
<center>
<ajax:ajaxpanel id="AjaxPanel1" runat="server">
<TABLE id="Table1" cellSpacing="4" cellPadding="4" width="340" border="1">
<TR>
<TD><FONT face="宋体">关键字:</FONT>
<asp:TextBox id="txtDm" runat="server" ToolTip="输入代码或拼音首字母索引" Width="70px"></asp:TextBox>
<asp:LinkButton id="lbShowResult" runat="server">搜 索</asp:LinkButton></TD>
<TD>
<asp:Button id="btnPre" runat="server" CssClass="btn" Text="前一页"></asp:Button>
<asp:Button id="btnNext" runat="server" CssClass="btn" Text="下一页"></asp:Button></TD>
</TR>
<TR>
<TD colSpan="2">
<asp:DataGrid id="dg" runat="server" ToolTip="双击可以选择" Width="100%" AllowPaging="True" AutoGenerateColumns="False"
ShowHeader="False" DataKeyField="dm">
<Columns>
<asp:TemplateColumn>
<HeaderStyle Width="10px"></HeaderStyle>
<HeaderTemplate>
<INPUT id="checkAll" type="checkbox" CommandName="Select2">
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox id="chk" runat="server" AutoPostBack="True"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<HeaderStyle Width="10px"></HeaderStyle>
<ItemTemplate>
<asp:RadioButton id="rad" runat="server" AutoPostBack="True"></asp:RadioButton>
</ItemTemplate>
</asp:TemplateColumn>
<asp:ButtonColumn Visible="False" Text="选择" CommandName="Select">
<HeaderStyle Width="10px"></HeaderStyle>
</asp:ButtonColumn>
<asp:BoundColumn DataField="dm">
<HeaderStyle Width="20px"></HeaderStyle>
</asp:BoundColumn>
<asp:BoundColumn DataField="name">
<HeaderStyle Width="200px"></HeaderStyle>
</asp:BoundColumn>
</Columns>
<PagerStyle Visible="False" Mode="NumericPages"></PagerStyle>
</asp:DataGrid></TD>
</TR>
<TR>
<TD id="tddrp" style="HEIGHT: 67px" align="center" colSpan="2" runat="server">
<asp:ListBox id="lst" runat="server"></asp:ListBox><INPUT id="btndelete" style="DISPLAY: none" onclick="javascript:deleteOption();" type="button"
value="删 除">
<asp:Button id="btndel" runat="server" CssClass="btn" Text="删 除"></asp:Button></TD>
</TR>
<TR>
<TD id="tdbtn" align="center" colSpan="2" runat="server"><INPUT class="btn" onclick="SetValue();" type="button" value="确 定">
<INPUT class="btn" id="btncanel" onclick="javascript:window.close();" type="button" value="取 消">
</TD>
</TR>
</TABLE>
</ajax:ajaxpanel>
</center>
</form>
</body>
</HTML>
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.OracleClient;
namespace LSA.ActiveForm
{
/// <summary>
/// ZiDian 的摘要说明。
/// </summary>
public class ZiDian : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid dg;
protected MagicAjax.UI.Controls.AjaxPanel AjaxPanel1;
protected System.Web.UI.WebControls.LinkButton lbShowResult;
protected System.Web.UI.WebControls.ListBox lst;
protected string strTableName="";
protected System.Web.UI.WebControls.Button btndel;
protected System.Web.UI.WebControls.Button btnNext;
protected System.Web.UI.WebControls.Button btnPre;
protected string num = "1";
protected System.Web.UI.HtmlControls.HtmlTableCell tddrp;
protected System.Web.UI.WebControls.TextBox txtDm;
protected System.Web.UI.HtmlControls.HtmlTableCell tdbtn;
protected System.Web.UI.HtmlControls.HtmlInputText txtDm2;
加载
Web 窗体设计器生成的代码
绑定数据
搜索
给datagrid行增加双击事件
多选钮事件
单选钮事件
在datagrid创建item时注册事件
删除
下一页
前一页
判断单选框与多选框是否显示
}
}
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.OracleClient;
namespace LSA.ActiveForm
{
/// <summary>
/// ZiDian 的摘要说明。
/// </summary>
public class ZiDian : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid dg;
protected MagicAjax.UI.Controls.AjaxPanel AjaxPanel1;
protected System.Web.UI.WebControls.LinkButton lbShowResult;
protected System.Web.UI.WebControls.ListBox lst;
protected string strTableName="";
protected System.Web.UI.WebControls.Button btndel;
protected System.Web.UI.WebControls.Button btnNext;
protected System.Web.UI.WebControls.Button btnPre;
protected string num = "1";
protected System.Web.UI.HtmlControls.HtmlTableCell tddrp;
protected System.Web.UI.WebControls.TextBox txtDm;
protected System.Web.UI.HtmlControls.HtmlTableCell tdbtn;
protected System.Web.UI.HtmlControls.HtmlInputText txtDm2;
加载
Web 窗体设计器生成的代码
绑定数据
搜索
给datagrid行增加双击事件
多选钮事件
单选钮事件
在datagrid创建item时注册事件
删除
下一页
前一页
判断单选框与多选框是否显示
}
}
在web.config下配置如下:
<httpModules>
<add name="MagicAjax" type="MagicAjax.MagicAjaxModule, MagicAjax" />
</httpModules>
<add name="MagicAjax" type="MagicAjax.MagicAjaxModule, MagicAjax" />
</httpModules>