二级菜单无刷新联动（XMLPOST + Jscript 方式）

二级菜单无刷新联动（ XMLPOST + Jscript 方式）

根据 Menu Type 的选择来，来获取 Menu 的数据

Menu_Type 存有两个选择 主菜单 和 子菜单

主菜单不存有菜单项，用来在在其下面挂菜单的，也就是说主菜单都存有子项菜单

Menu 选择子菜单， Menu 列出所有的菜单内容

程序是放在 ascx 中做的，下面我们来看代码部分

1. 前台代码（全部代码 , 其实我们主要看 jscript 部分 XmlPost(obj) 和背景色 high light 部分）

<% @ Control Language ="C#" AutoEventWireup ="true" CodeFile ="UC_Menu_Level_Init.ascx.cs" Inherits ="Live.Admin.UserControls.UC_Menu_Level_Init" %>

< table border ="1" bordercolor ="lightblue" bordercolordark ="#ffffff" cellpadding ="0"

cellspacing ="0" width ="100%">

< tr >

< td style ="width: 100%; height: 13px" valign ="top">

< table border ="0" bordercolor ="#888888" bordercolordark ="#ffffff" cellpadding ="0"

cellspacing ="0" width ="100%">

< tr >

< td style ="width: 100%; height: 19px" valign ="top">

Menu Level Edit </ td >

</ tr >

</ table >

< table border ="0" bordercolor ="#888888" bordercolordark ="#ffffff" cellpadding ="0"

cellspacing ="0" width ="100%">

< tr >

< td align ="left" style ="width: 160px; height: 24px" valign ="top">

Menu Type </ td >

< td align ="left" style ="width: 679px; height: 24px" valign ="top">

< asp : DropDownList ID ="DropDownList_MenuType" runat ="server" Width ="154px">

</ asp : DropDownList ></ td >

</ tr >

< tr >

< td align ="left" style ="width: 160px; height: 24px" valign ="top">

Menu Level Code </ td >

< td align ="left" style ="width: 679px; height: 24px" valign ="top">

< asp : TextBox ID ="TextBox_Level_Code" runat ="server" Width ="263px"></ asp : TextBox ></ td >

</ tr >

< tr >

< td align ="left" style ="width: 160px; height: 24px" valign ="top">

Menu Parent Level Code </ td >

< td align ="left" style ="width: 679px; height: 24px" valign ="top">

< asp : TextBox ID ="TextBox_Level_Parent_Code" runat ="server" Width ="263px"></ asp : TextBox ></ td >

</ tr >

< tr >

< td align ="left" style ="width: 160px; height: 24px" valign ="top">

Menu Level Name(En) </ td >

< td align ="left" style ="width: 679px; height: 24px" valign ="top">

< asp : TextBox ID ="TextBox_Level_Name_En" runat ="server" Width ="263px"></ asp : TextBox ></ td >

</ tr >

< tr style ="color: #000000">

< td align ="left" style ="width: 160px; height: 24px" valign ="top">

Menu Level Name(Cn) </ td >

< td align ="left" style ="width: 679px; height: 24px" valign ="top">

< asp : TextBox ID ="TextBox_Level_Name_Cn" runat ="server" Width ="263px"></ asp : TextBox ></ td >

</ tr >

< tr style ="color: #000000">

< td align ="left" style ="width: 160px; height: 22px">

Menu </ td >

< td align ="left" style ="width: 679px; height: 22px">< asp : DropDownList ID ="DropDownList_Menu" runat ="server" Width ="154px">

</ asp : DropDownList ></ td >

</ tr >

< tr >

< td align ="left" style ="width: 160px; height: 24px">

Sort Number </ td >

< td align ="left" style ="width: 679px; height: 24px">

< asp : TextBox ID ="TextBox_SortNumber" runat ="server" Width ="41px"></ asp : TextBox ></ td >

</ tr >

< tr >

< td align ="left" style ="width: 160px; height: 24px">

Status </ td >

< td align ="left" style ="width: 679px; height: 24px">

< asp : DropDownList ID ="DropDownList_Status" runat ="server" Width ="154px">

</ asp : DropDownList ></ td >

</ tr >

</ table >

< table border ="0" bordercolor ="#888888" bordercolordark ="#ffffff" cellpadding ="0"

cellspacing ="0" width ="100%">

< tr >

< td style ="width: 100%; height: 21px" valign ="top">

< asp : Button ID ="Button_Menu_Add" runat ="server" Text ="Add"

Width ="58px" /></ td >

</ tr >

</ table >

< asp : DataGrid ID ="DataGrid_MenuList" runat ="server" AutoGenerateColumns ="False" BackColor ="#F7F7F7"

BorderColor ="#F7F7F7" BorderStyle ="Solid" BorderWidth ="1px" CssClass ="table"

DataKeyField ="Menu_ID" Font-Bold ="False" Font-Italic ="False" Font-Overline ="False"

Font-Size ="10pt" Font-Strikeout ="False" Font-Underline ="False" Width ="100%">

< FooterStyle CssClass ="headcenter" />

< EditItemStyle BackColor ="LightGray" ForeColor ="Black" Width ="100%" />

< SelectedItemStyle BackColor ="Transparent" />

< AlternatingItemStyle BackColor ="White" BorderColor ="White" />

< ItemStyle BackColor ="AliceBlue" CssClass ="textcenter" Font-Bold ="False" Font-Italic ="False"

Font-Overline ="False" Font-Strikeout ="False" Font-Underline ="False" />

< HeaderStyle BackColor ="LightSteelBlue" CssClass ="headcenter" Font-Bold ="True" Font-Italic ="False"

Font-Overline ="False" Font-Strikeout ="False" Font-Underline ="False" />

< Columns >

< asp : BoundColumn DataField ="Menu_ID" HeaderText ="Menu ID"></ asp : BoundColumn >

< asp : BoundColumn DataField ="Menu_Name_En" HeaderText ="Menu Name(En)"></ asp : BoundColumn >

< asp : BoundColumn DataField ="Menu_Name_Cn" HeaderText ="Menu Name(Cn)"></ asp : BoundColumn >

< asp : BoundColumn DataField ="Url" HeaderText ="Url"></ asp : BoundColumn >

< asp : TemplateColumn HeaderText ="Status">

< ItemTemplate >

< asp : Label ID ="Level_Status_L1" runat ="server" Text =' <% # DataBinder.Eval(Container, "DataItem.Status.Status_Desc_Cn") %> '

Visible ="true"></ asp : Label >

</ ItemTemplate >

< EditItemTemplate >

< asp : DropDownList ID ="DropDownList_Status_D" runat ="server" Width ="112px">

</ asp : DropDownList >

< asp : Label ID ="Level_Status_L2" runat ="server" Text =' <% # DataBinder.Eval(Container, "DataItem.Status.Status_Code") %> '

Visible ="False"></ asp : Label >

</ EditItemTemplate >

</ asp : TemplateColumn >

< asp : TemplateColumn HeaderText ="Update Menu">

< ItemStyle Width ="15%" />

< ItemTemplate >

< asp : LinkButton ID ="Linkbutton_Edit" runat ="server" CausesValidation ="false" CommandName ="Edit"

NAME ="Linkbutton1" Text ="&lt;img border=0 src=Images/Files/Edit.gif alt=Edit this item&gt;"></ asp : LinkButton >

</ ItemTemplate >

< EditItemTemplate >

< asp : LinkButton ID ="Linkbutton2" runat ="server" CausesValidation ="false" CommandName ="Update"

NAME ="Linkbutton2" Text ="&lt;img border=0 src=Images/Files/Save.gif alt=Save...&gt;"></ asp : LinkButton > &nbsp;

< asp : LinkButton ID ="Linkbutton3" runat ="server" CausesValidation ="false" CommandName ="Cancel"

NAME ="Linkbutton3" Text ="&lt;img border=0 src=Images/Files/Undo.gif alt=Cancel...&gt;"></ asp : LinkButton >

</ EditItemTemplate >

</ asp : TemplateColumn >

< asp : ButtonColumn CommandName ="Delete" HeaderText ="Delete Menu" Text ="&lt;img border=0 src=Images/Files/Delete.gif alt=Delete this item&gt;">

</ asp : ButtonColumn >

</ Columns >

</ asp : DataGrid ></ td >

</ tr >

</ table >

< script type ="text/javascript" defer =true>

// 以 XML 求取数据

function XmlPost(obj)

{

var svalue = obj.value;

//alert(svalue);

if (svalue== " 请选择 " )

{

document.getElementById( '<%=DropDownList_Menu.ClientID %>' ).length=0;

}

else if (svalue==1) //Top 主菜单

{

document.getElementById( '<%=DropDownList_Menu.ClientID %>' ).length=0; // 清空原来存在的

document.getElementById( '<%=DropDownList_Menu.ClientID %>' ).options.add( new Option( "-- 不设菜单 --" ,0)); // 不设菜单， Menu_ID 都设为

}

else

{

var webFileUrl = "?TypeID=" + svalue;

var result = "" ;

var xmlHttp = new ActiveXObject( "MSXML2.XMLHTTP" );

xmlHttp.open( "POST" , webFileUrl, false ); // 使用 XMLPOST 方式

xmlHttp.send( "" ); // 发送

result = xmlHttp.responseText; // 得到返回的结果

if (result != "" )

{

document.getElementById( '<%=DropDownList_Menu.ClientID %>' ).length=0; // 清空原来存在的

var LArray = result.split( "," );

for ( var i=0;i<LArray.length;i++)

{

var ary1 = LArray[i].toString().split( "|" );

//alert(ary1[0].toString());

//alert(ary1[1].toString());

document.getElementById( '<%=DropDownList_Menu.ClientID %>' ).options.add( new Option(ary1[0].toString(),ary1[1].toString()));

}

}

<

二级菜单无刷新联动（XMLPOST + Jscript 方式）