asp.net 结合YUI 3.0小示例


注:由于本人主要做后台的就只用到了IO空间下面的一些东西,贴个小小的级联效果来吧,
废话少说先拿代码说话了,

复制代码 代码如下:

Demo.show={
Test:function(e,Y)
{
config=Demo.config;
function onshengchange(e)
{
var sheng = Y.Node.get('#'+config.sheng).get("value");
var speccode = Y.Node.get('#'+config.speciality);
var years = Y.Node.get('#'+config.years);
var timeslist =Y.Node.get('#'+config.times);
var content="<option selected=selected>请选择</option>";
speccode.setContent("<option selected=selected>加载数据....</option>");
years.setContent(content);
timeslist.setContent(content);
var requestSpeciality = Y.io("Test.aspx", {
method:"POST",
data:"type=sheng&sheng="+sheng,
arguments:{event:"cclchange"},
on:
{
success:successHandler,
failure:failureHandler
}
}
);
}
function onspecialitychange(e)
{

var sheng = Y.Node.get('#'+config.sheng).get("value");
var speccode = Y.Node.get('#'+config.speciality).get("value");
var years = Y.Node.get('#'+config.years);
var timeslist =Y.Node.get('#'+config.times);
var content="<option selected=selected>请选择</option>";
years.setContent("<option selected=selected>加载数据....</option>");
timeslist.setContent(content);
var requestSpeciality = Y.io("Test.aspx", {
method:"POST",
data:"type=speciality&cclid="+ccl+"&speccode="+speccode,
arguments:{event:"specchange"},
on:
{
success:successHandler,
failure:failureHandler
}
}
);
}
function onyearchange(e)
{
var sheng = Y.Node.get('#'+config.sheng).get("value");
var speccode = Y.Node.get('#'+config.speciality).get("value");
var year = Y.Node.get('#'+config.years).get("value");
var timeslist =Y.Node.get('#'+config.times);
timeslist.setContent("<option selected=selected>加载数据....</option>");
var requestSpeciality = Y.io("Test.aspx", {
method:"POST",
data:"type=year&sheng="+sheng+"&speccode="+speccode+"&year="+year,
arguments:{event:"yearchange"},
on:
{
success:successHandler,
failure:failureHandler
}
}
);
}

function ontimeslistchagne(e){
//这里可以一直连下去
}
function successHandler(id, o,args){
if(args!=null)
if(args.event!=null)
{
if(args.event=='shengchange')
{
var root = o.responseXML.documentElement;
var speciality =Y.Node.get('#'+config.speciality);
var content="<option selected=selected>请选择</option>";
for(i=0;i<root.childNodes.length;i++)
{
var node=root.childNodes[i];
var value=node.getElementsByTagName("Code")[0].text;
var text=node.getElementsByTagName("CName")[0].text;
content+="<option value="+value +">"+text+"</option>";
}
speciality.setContent(content);
}
else if(args.event=='specchange')
{
var root = o.responseXML.documentElement;
var yearlist =Y.Node.get('#'+config.years);
var content="<option selected=selected>请选择</option>";
for(i=0;i<root.childNodes.length;i++)
{
var value=root.childNodes[i].text;
var text=value;
content+="<option value="+value +">"+text+"</option>";
}
yearlist.setContent(content);
}
else if(args.event=='yearchange')
{
var root = o.responseXML.documentElement;
var timeslist =Y.Node.get('#'+config.times);
var content="<option selected=selected>请选择</option>";
var times=Y.DataType.Number.parse(root.text);
if(times==null)
times=0;
for(i=0;i<times;i++)
{
content+="<option value="+(i+1) +">"+(i+1)+"</option>";
}
timeslist.setContent(content);
}

}
}


function failureHandler(id, o){
alert("数据获取成功");
}
var sheng = Y.Node.get('#'+config.sheng);
var speccode = Y.get('#'+config.speciality);
var year = Y.get('#'+config.years);
var timeslist =Y.Node.get('#'+config.times);

sheng.on("change",oncclchange);
speccode.on("change",onspecialitychange);
year.on("change",onyearchange);
timeslist.on("change",ontimeslistchagne);

}
};
YUI().use("node","datatype-number","io-base",function(Y) {
function onload(e)
{
Demo.show.Test(e,Y);
}
Y.on("load", onload, window);
});


复制代码 代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="sheng" runat="server">
</asp:DropDownList>
<asp:DropDownList ID="speciality" runat="server">
</asp:DropDownList>
<asp:DropDownList ID="year" runat="server">
</asp:DropDownList>
<asp:DropDownList ID="times" runat="server">
</asp:DropDownList>
</div>
</form>
</body>
</html>


复制代码 代码如下:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
public partial class Test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.ClientScript.IsClientScriptIncludeRegistered("YUI"))
Page.ClientScript.RegisterClientScriptInclude("YUI", path + "/build/yui/yui-min.js");
if (!Page.ClientScript.IsClientScriptIncludeRegistered("CLINET"))
Page.ClientScript.RegisterClientScriptInclude("CLINET", path + "/js/clinet.js");
StringBuilder scriptBlock = new StringBuilder();
scriptBlock.Append("<script type="text/javascript"><!--
");
scriptBlock.Append("Demo.config={");
scriptBlock.Append("sheng:'" + this.sheng.ClientID + "',");
scriptBlock.Append("speciality:'" + this.specialityList.ClientID + "',");
scriptBlock.Append("years:'" + this.yearList.ClientID + "',");
scriptBlock.Append("times:'" + this.timesList.ClientID + "'");
scriptBlock.Append("};");
scriptBlock.Append("
// --></script>");
Page.ClientScript.RegisterClientScriptBlock(GetType(), "QualityAssessmentPlanCascadingDropDown", scriptBlock.ToString());

}
}

这上面为主要代码,上面那段JS我实际写的请求的是一个WEBService ,你可以换一个aspx页面都行,

还有一些后台处理的到数据的就没有贴出来了,每一个级联请求的后台都是返回一个对象数组 ,具体的解释就不用说了, 不懂的在讨论。。。



相关阅读:
邮件发送类,支持HTML格式,支持优先级设置
ASP编程入门进阶(十一):Chat聊天程序
数据库分页存储过程代码
MYSQL中如何存取二进制文件
在B/S开发中经常用到的JavaScript技术
在SQL Server计算列和平均值
利用XMLHTTP实现的二级连动Select
提升JSP应用程序的七大绝招
VBS教程:方法-Keys 方法
asp在IE浏览器中下载服务端上的各类文件的实现方法
让任务管理器中的CPU跳舞的js代码
sockaddr与sockaddr_in
MSCRM调用外部JS文件
从DBA到Oracle Applications DBA的转变过程
快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 部队犯错误万能检讨书 新年团拜会上的讲话 初中初一作文750字:奥运会观后感 写好网络推广文的六大技巧 春天的怀想 北师大版三年级作文 领导干部廉洁从业承诺书 冶河渡槽观后感 【精品】医院实践心得体会 小学四年级作文600字:珍爱生命注意安全 关于建军节的由来作文:建军节的由来 军人入党志愿书 遗失友谊 九华山导游词开场白 大学运动会开幕式主持词范本 〆    如果我死了,那就是爱了你一辈子 初中地理备课组工作计划 最新励志的晚安心语,晚安心语励志语录 残爱飘零,无言成殇 大地走笔_其它篇(29)漫话黄土 秋影作文1100字 路还在走着 幼儿园2014年小一班下学期安全工作计划 元宵节祝福语短信2015 社会主义新农村示范村建设督查情况通报 我家的蒜苗 安全生产工作会总结 赠崔道士 小学四年级作文800字:可爱的小猫 高三毕业典礼学生家长发言稿 爷爷的故事350字 校长在毕业会演讲资料 七律《书生吟》三首 与书有约550字 2017年年党课培训心得 夏日记事_初三写事作文开头100字 我的忧愁 成全与迁就 孤独的背后,是你永远看不到的痛。。。 鱼与飞鸟 活泼的小猫咪作文600字 老布什关键表态 为自已喝彩500字 读书节古诗词知识比赛总结发言稿 海风从我身边轻轻走过 关于生活经典语录 最好的事情就是经常和你在一起 我悟到了一理儿 关于农民养老保险管理制度 不要廉价出租女人的妩媚 论钱与幸福的关系

Copyright © 2016 phpStudy |