Hướng dẫn sử dụng lồng các control trong ASP.Net

Khi xây dựng một website, nhiều khi bạn phải thực hiện lồng các control để hiển thị dữ liệu, vd như hiển thị các bài viết theo đúng danh mục của nó. Ở đây, WEBXAULA sẽ minh hoạ cách lồng một Datalist trong một Gridview.

 Đầu tiên, bạn chuẩn bị cơ sở dữ liệu mẫu như sau:

Code html trong trang aspx viết như sau:

<asp:GridView ID="DS_DanhMuc" runat="server" AutoGenerateColumns="False"

            ShowHeader="false" onrowdatabound="DS_DanhMuc_RowDataBound">

            <Columns>

                <asp:TemplateField>

                <ItemTemplate>

                    <%# Eval("danhmucName") %>

                    <asp:Literal ID="lblMa" Text=<%# Eval("danhmucID") %> Visible="false" runat="server"></asp:Literal>                   

<asp:DataList ID="DS_SanPham" runat="server" RepeatColumns="3">

                    <ItemTemplate>

                        <img width="100px" src=<%# "hinh/sanpham/" + Eval("hinh") %> />

                        <br />

                        <%# Eval("sanphamName") %>

                    </ItemTemplate>

                    </asp:DataList>


                </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

Bạn viết hàm để lấy dữ liệu hiển thị cho phần danh mục, ở đây tôi dùng Linq để tiến hành truy vấn dữ liệu.

private void HienDuLieu()
    {
        try

        {

            ketnoiDataContext pKetNoi = new ketnoiDataContext();

            var pDanhMuc = from p in pKetNoi.DanhMucs

                           orderby p.DanhMucID descending

                           select p;

            DS_DanhMuc.DataSource = pDanhMuc;

            DS_DanhMuc.DataBind();

        }

        catch (Exception ex)

        {

            Response.Write(ex.Message.ToString());

        }

    }

Gridview bao bên ngoài ta sẽ tạo sự kiện RowDataBound để xử lý từng dòng dữ liệu được bind vào gridview.

protected void DS_DanhMuc_RowDataBound(object sender, GridViewRowEventArgs e)

    {
        if (e.Row.RowIndex < 0) return;

        DataList DS_SanPham = (DataList)e.Row.FindControl("DS_SanPham");

        Literal lblMa = (Literal)e.Row.FindControl("lblMa");

        ketnoiDataContext pKetNoi = new ketnoiDataContext();

        var pSanPham = from p in pKetNoi.SanPhams

                       where p.DanhMucID == Int32.Parse(lblMa.Text)

                       select p;

        DS_SanPham.DataSource = pSanPham;

        DS_SanPham.DataBind();

    }

Bạn chú ý trong Gridview tôi có để một literal để lấy mã của danh mục tương ứng và từ đó hiển thị sản phẩm lên Datalist theo đúng danh mục đó. Do không cần hiển thị nên literal này ta set visible = false.

Về giao diện thì bạn có thể tuỳ chỉnh sao cho đẹp mắt là được. Chúc các bạn thành công.