02/10/2018, 20:46
Xây dựng Dropdown Menu với Database Phần II
Trong phần I của bài viết mình đã hướng dẫn bạn cách viết Store cho memu. Trong phần II này mình sẽ hướng dẫn tiếp để thực thi được menu trong trang asp.net. Trong phần I của bài viết mình đã hướng dẫn bạn cách viết Store cho memu. Trong phần II này mình sẽ hướng dẫn ...
Trong phần I của bài viết mình đã hướng dẫn bạn cách viết Store cho memu. Trong phần II này mình sẽ hướng dẫn tiếp để thực thi được menu trong trang asp.net.
Trong phần I của bài viết mình đã hướng dẫn bạn cách viết Store cho memu. Trong phần II này mình sẽ hướng dẫn tiếp để thực thi được menu trong trang asp.net.
Trong trang asp.net bạn vẫn cần Style như trong bài "Xây dựng Dropdown Menu với html và Css" ngoại ra bạn cần một Literal để hiển thị dữ liệu như sau:
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>hmweb-Chia se la niem vui</title> <%--Create by: hungbv@hmweb.com.vn--%> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <style> *{margin: 0; padding: 0} body { font-size: 62.5%;} ul { list-style: none;} #wrapper { awidth: 900px;margin: 10px auto; } ul#topnav { float: left; awidth: 780px; position: relative; font-size: 1.4em; height: 28px; background: #e99765 url(http://hmweb.com.vn/hmweb_menu/images/MenuTop_bg.jpg) repeat-x; behavior: url(whateverhover.htc); } ul#topnav li { float: left;height: 28px; padding: 0px; border-right: 1px solid #2f6184; } ul#topnav li a { padding: 5px 15px; display: block; color: #f0f0f0; text-decoration: none; } ul#topnav li:hover { background: #b21a1a url(http://hmweb.com.vn/hmweb_menu/images/bottom-nav.jpg) repeat-x; } ul#topnav li ul.children { float: left; height: 28px; line-height: 28px; padding: 0px; position: absolute; left: 0px; top: 28px;display: none; awidth: 780px; background: #cc2928; color: white; -moz-border-radius: 0px 0px 1px 1px; -khtml-border-radius: 0px 0px 1px 1px; -webkit-border-radius: 0px 0px 1px 1px; } ul#topnav li ul.children li { border: none; } ul#topnav li:hover ul { display: block; } ul#topnav li ul a { display: inline;} ul#topnav li ul a:hover {text-decoration: underline;} ul#topnav li ul li:hover { background: none;} </style> </head> <body> <form id="form1" runat="server"> <div> <asp:Literal ID="ltlMenu" runat="server"></asp:Literal> </div> </form> </body> </html>
1. Hàm thực thi Store trả về một Datatable
Trong code behind bạn cần viết các hàm sau:
private static DataTable ThucThiStore_DataTable( string StoredProcedure, params SqlParameter[] Parameters) { string ConnectionString = @"Server =.SQL2005;Initial Catalog=BaiTap;User ID=sa;Password=sa"; SqlConnection Conn = new SqlConnection(ConnectionString); SqlCommand Command = new SqlCommand(StoredProcedure, Conn); if (Parameters != null) { Command.Parameters.Clear(); Command.Parameters.AddRange(Parameters); } DataSet ds = new DataSet(); SqlDataAdapter da = new SqlDataAdapter(StoredProcedure, Conn); Command.CommandType = CommandType.StoredProcedure; da.SelectCommand = Command; try { Conn.Open(); da.Fill(ds); } finally { if (Conn.State == ConnectionState.Open) Conn.Close(); Conn.Dispose(); } return ds.Tables[0]; }
2. Hàm Load dữ liệu
private void NapDuLieu(string StoreName) { SqlParameter[] arrParam = { }; DataTable dtbData = ThucThiStore_DataTable(StoreName, arrParam); if (dtbData.Rows.Count > 0) { ltlMenu.Text = dtbData.Rows[0]["MenuString"] + ""; } }
Trong hàm Page_Load Bạn chỉ cần gọi hàm và truyền tên Store vào như sau:
if (!IsPostBack) { NapDuLieu("spGetMenuString"); }
Bạn download mã muồn và Database về tham khảo tại đây Sau khi down về giải nén và tạo Database, sau đó sửa lại chuỗi ConnectionString là OK
Chúc bạn thành công.
Nguồn: http://www.thietkewebsmart.com/asp-net-csharp/xay-dung-dropdown-menu-voi-database-phan-ii/643.htm
Bình luận