无刷新无限级菜单联动

功能:无刷新无限级菜单联动(原创:申请加精)

Asp.Net(C#)+AjaxPro+MSSQL(需引用AjaxPro.2.dll)



Infinite_Class.aspx
C# code
   
   
<% @ Page Language = " C# " AutoEventWireup = " true " CodeBehind = " Infinite_Class.aspx.cs " Inherits = " Web.AJAXPro.Infinite_Class " %> <! 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 > Infinite_Class无限级分类测试(作者QQ: 241181876 ) -- 转载请注明出处 </ title > </ head > < body > < form id = " form1 " runat = " server " > < div > < span id = " select1 " ></ span ></ div > < hr /> < div id = " test " > ttt </ div > < input type = " button " value = " 设置值 " onclick = " iaocLianDong.SetValue(1,4,12,14,15,16,17,18,19); " > < input type = " button " value = " 取值 " onclick = " alert(iaocLianDong.GetValue()); " > < input type = " button " value = " 读取第一个值 " onclick = " alert(document.getElementById('select1').childNodes[0].value) " /> < script language = " javascript " type = " text/javascript " defer = " defer " > // Infinite_Class无限级分类测试(作者QQ:241181876)--转载请注明出处 function CreateOption(i1,pid1,myWebClientID) { var myWebClientID = document.getElementById(myWebClientID); this .CreateNewOption = function(i,pid) { var arr = Web.AJAXPro.Infinite_Class.GetClassList( "" + pid + "" ).value; while (myWebClientID.childNodes.length - 1 >= i) { myWebClientID.removeChild(myWebClientID.childNodes[myWebClientID.childNodes.length - 1 ]); } var tmp; var created = false ; for ( var j = 0 ; j < arr.Rows.length; j ++ ) { if (arr.Rows[j][arr.Columns[ 2 ].Name] == pid) { if (created == false ) { created = true ; tmp = document.createElement( " select " ); tmp.setAttribute( " id " , " liandong_ " + i); // tmp.setAttribute("multiple", "multiple"); // tmp.options[tmp.length] = new Option( " 请选择 " , " -1 " ); tmp.onchange = function() { pp(parseInt(tmp.getAttribute( " id " ).replace( " liandong_ " , "" )) + 1 ,tmp.value); }; myWebClientID.appendChild(tmp); } tmp.options[tmp.options.length] = new Option(arr.Rows[j][arr.Columns[ 1 ].Name], arr.Rows[j][arr.Columns[ 0 ].Name]); } } } var pp = this .CreateNewOption; this .GetValue = function() { var value = "" ; for (var i = 0 ; i < myWebClientID.childNodes.length; i ++ ) { var obj = myWebClientID.childNodes[i]; for (var j = 0 ; j < obj.options.length; j ++ ) { if (obj.options[j].selected) { value += obj.options[j].value + " , " ; break ; } } } return value; } this .SetValue = function() { for (var i = 0 ; i < arguments.length; i ++ ) { myWebClientID.childNodes[i].value = arguments[i]; this .CreateNewOption(i + 1 , arguments[i]); } } this .CreateNewOption(i1,pid1); } var iaocLianDong = new CreateOption( 0 , 0 , " select1 " ); </ script > </ form > </ body > </ html >

Infinite_Class.aspx.cs
C# code
   
   
using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using System.Data.SqlClient; using BLL; // Infinite_Class无限级分类测试(作者QQ:241181876)--转载请注明出处,感谢 小灰 提供指导 namespace Web.AJAXPro { public partial class Infinite_Class : System.Web.UI.Page { protected void Page_Load( object sender, EventArgs e) { AjaxPro.Utility.RegisterTypeForAjax( typeof (Infinite_Class)); } [AjaxPro.AjaxMethod] public DataTable GetClassList( string pid) { SqlConnection conn = new SqlConnection( " Server=.;DataBase=IAOC;uid=sa;pwd= " ); conn.Open(); SqlCommand cmd = new SqlCommand( " Select Cid,ClassName,pid from InfiniteClass Where pid= " + pid + " order by orderby desc " , conn); DataTable dt = new DataTable( " class " ); SqlDataAdapter sda = new SqlDataAdapter(cmd); sda.Fill(dt); conn.Close(); return dt; } } }

SQL测试环境
SQL code
   
   
use zdl_data CREATE TABLE [ dbo ] . [ InfiniteClass ] ( [ cid ] [ int ] IDENTITY ( 1 , 1 ) NOT NULL , [ PID ] [ int ] NULL , [ ClassName ] [ nvarchar ] ( 50 ) NULL , [ Orderby ] [ int ] NULL , ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 0 , ' a1 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 0 , ' b2 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 0 , ' c3 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 1 , ' a11 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 1 , ' a12 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 1 , ' a13 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 1 , ' a14 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 2 , ' b21 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 2 , ' b22 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 3 , ' c31 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 3 , ' c32 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 4 , ' a1111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 4 , ' a1112 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 12 , ' a11111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 14 , ' a111111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 15 , ' a1111111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 16 , ' a11111111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 17 , ' a111111111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 18 , ' a1111111111 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 8 , ' b211 ' , 1 ) insert into InfiniteClass(PID,ClassName,OrderBy) values ( 20 , ' b2111 ' , 1 )
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值