二級菜單無刷新聯動（ 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 ="<img border=0 src=Images/Files/Edit.gif alt=Edit this item>"></ asp : LinkButton >
</ ItemTemplate >
< EditItemTemplate >
< asp : LinkButton ID ="Linkbutton2" runat ="server" CausesValidation ="false" CommandName ="Update"
NAME ="Linkbutton2" Text ="<img border=0 src=Images/Files/Save.gif alt=Save...>"></ asp : LinkButton >
< asp : LinkButton ID ="Linkbutton3" runat ="server" CausesValidation ="false" CommandName ="Cancel"
NAME ="Linkbutton3" Text ="<img border=0 src=Images/Files/Undo.gif alt=Cancel...>"></ asp : LinkButton >
</ EditItemTemplate >
</ asp : TemplateColumn >
< asp : ButtonColumn CommandName ="Delete" HeaderText ="Delete Menu" Text ="<img border=0 src=Images/Files/Delete.gif alt=Delete this item>">
</ 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()));
}
}
<
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
