Cấp bậc tác giả:

DOTNET

Hướng dẫn xây dựng trang mua hàng đơn giản

Được viết bởi webmaster ngày 10/10/2013 lúc 07:44 PM
Để làm trang mua hàng cần thực hiện các chức năng sau: Hiển thị sản phẩm cần mua, hiển thị chi tiết sản phẩm, lưu tạm sản phẩm vào giỏ hàng sau khi kích chọn mua, hiển thị giỏ hàng, cập nhật số lượng hoặc xóa hàng trên giỏ hàng tương ứng, thực hiện insert dữ liệu sau khi mua thành công món hàng.
  • 0
  • 2090
Tải tệp tin: Click ở đây

Hướng dẫn xây dựng trang mua hàng đơn giản


Để làm trang mua hàng cần thực hiện các chức năng sau: Hiển thị sản phẩm cần mua, hiển thị chi tiết sản phẩm, lưu tạm sản phẩm vào giỏ hàng sau khi kích chọn mua, hiển thị giỏ hàng, cập nhật số lượng hoặc xóa hàng trên giỏ hàng tương ứng, thực hiện insert dữ liệu sau khi mua thành công món hàng.

1. Hiển thị sản phẩm cần mua trong Control DataList:

<span style="font-size: 11pt; color: #0033cc"><span style="color: #cc0099"><span style="font-size: 24pt">
            Danh Sách Hàng Hóa</span><br />
        </span>
            <asp:DataList ID="DataList1" runat="server" RepeatColumns="3" DataKeyField="masach" DataSourceID="SqlDataSource1" Font-Bold="True" OnItemCommand="DataList1_ItemCommand">
                <ItemTemplate>
                    <table>
                        <tr>
                            <td rowspan="4" style="width: 100px">
                                <asp:Image ID="Image1" runat="server" ImageUrl='<%#"~/image/"+Eval("HinhAnh")%>' />
                               <td style="width: 157px; height: 19px; text-align: left;">
                                   <asp:Label ID="lblmasp" runat="server" Text='<%#Eval("masach") %>'></asp:Label></td>
                        </tr>
                        <tr>
                            <td style="width: 157px; height: 21px; text-align: left;">
                            <asp:Label ID="lbltenhang" runat="server" Text='<%#Eval("Tensach") %>'></asp:Label>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 157px; height: 4px; text-align: left;">
                             <asp:Label ID="lbltacgia" runat="server" Text='<%#Eval("Tentacgia") %>'></asp:Label>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 157px; height: 4px; text-align: left;">
                                <asp:Label ID="lblgia" runat="server" Text='<%#Eval("gia") %> '></asp:Label>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 100px">
                                <asp:ImageButton ID="ImageButton1" CommandName="add" runat="server" ImageUrl="~/image/chonmua.gif" /></td>
                            <td style="width: 157px">
                                <asp:HyperLink ID="HyperLink1" runat="server" ImageUrl="~/image/goon1.gif" Width="98px">xem chi tiet</asp:HyperLink></td>
                        </tr>
                    </table>
                </ItemTemplate>
                <HeaderTemplate>
                    <asp:Image ID="Image2" runat="server" ImageUrl="~/image/b_sphot.gif" />
                </HeaderTemplate>
                <SeparatorTemplate>
                    <asp:Image ID="Image3" runat="server" ImageUrl="~/image/news.gif" />
                </SeparatorTemplate>
                <FooterTemplate>
                    &nbsp;
                </FooterTemplate>
            </asp:DataList>&nbsp;
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:BookShopConnectionString %>"
                SelectCommand="SELECT Books.Masach, Books.Tensach, Books.Gia, Books.Hinhanh, Tacgia.Tentacgia FROM Books INNER JOIN Tacgia ON Books.Matacgia = Tacgia.Matacgia">
            </asp:SqlDataSource>
        </span>

Xử lý sự kiện click mua hàng trong Datalist, lưu tạm sản phẩm vào trong Giỏ hàng
    protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
    {
        int sd = e.Item.ItemIndex;
        
        DataTable tb = new DataTable();
        string name = e.CommandName;
        if (name == "add")
        {
            string ma = DataList1.DataKeys[sd].ToString();

            Label ten = (Label)e.Item.FindControl("lbltenhang");
            string t = ten.Text;

            Label gia= (Label)e.Item.FindControl("lblgia");
            int giasp = int.Parse(gia.Text);

            tb=ThemGioHang(t, giasp, 1, ma);
        }

        Session["GioHang"] = tb;
        Response.Redirect("giohang.aspx");
    }
2. Hiển thị giỏ hàng trong Control GridView:

 <table>
            <tr>
                <td colspan="2" style="height: 150px">
<asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" DataKeyNames="MaSP" GridLines="None" AutoGenerateColumns="False" OnRowCommand="GridView1_RowCommand" Height="67px" Width="608px">
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <RowStyle BackColor="#EFF3FB" />
            <EditRowStyle BackColor="#2461BF" />
            <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
            <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <AlternatingRowStyle BackColor="White" />
            <Columns>
                <asp:CommandField ButtonType="Image" DeleteImageUrl="~/image/index_delete.png" HeaderText="X&#243;a"
                    ShowDeleteButton="True" />
                <asp:BoundField HeaderText="t&#234;n sản phẩm" DataField="Tensp" />
                <asp:BoundField HeaderText="đơn gi&#225;" DataField="Gia"/>
                <asp:TemplateField HeaderText="số lượng">
                 <ItemTemplate> 
                  <asp:TextBox ID="txtsl" runat="server" Text='<%#Eval("SoLuong")%>' ></asp:TextBox>
                 </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField HeaderText="th&#224;nh tiền" DataField="TongGia"  />
            </Columns>
        </asp:GridView>
       </td>
            </tr>
            <tr>
                <td style="height: 21px; text-align: right">
                    <span style="color: #000099"><strong><em>&nbsp;Tổng Tiền Giỏ hàng</em></strong></span></td>
                <td style="height: 21px; text-align: left">
                    <asp:Label ID="lbltongtien" runat="server" Font-Bold="True" ForeColor="#FF3399" Text="tổng tiền"></asp:Label></td>
            </tr>
             <tr>
                <td style="height: 21px; text-align: right">
                    <span style="color: #000099">
                   
        <asp:HyperLink ID="HyperLink1" runat="server" ImageUrl="~/image/more_product0.gif"
            NavigateUrl="~/Default.aspx">HyperLink</asp:HyperLink></span></td>
                <td style="height: 21px; text-align: left">
        <asp:ImageButton ID="ImageButton1" runat="server" Height="20px" ImageUrl="~/image/update_qty_vn.gif"
            OnClick="ImageButton1_Click" /></td>
            </tr>
        </table>

Xử lý hiển thị sản phẩm trên giỏ hàng:
     public DataTable tb = new DataTable();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            tb = (DataTable)Session["GioHang"];
            if (tb != null)
            {
                if (tb.Rows.Count > 0)
                {
                    GridView1.DataSource = tb;
                    GridView1.DataBind();
                }
                lbltongtien.Text = tongtien(tb).ToString();
            }
        }
    }
Sự kiện Cập nhật Giỏ hàng:
  protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
    {
        tb = (DataTable)Session["GioHang"];
        for (int i = 0; i < GridView1.Rows.Count; i++)
        {
           TextBox sl = (TextBox)GridView1.Rows[i].FindControl("txtsl");
           int soluong = int.Parse(sl.Text);
            //cập nhật số lượng cho giỏ hàng
           tb.Rows[i]["SoLuong"] = soluong;
            //lấy đơn giá của hàng từ giỏ hàng về. 
           int g = int.Parse(tb.Rows[i]["gia"].ToString());
            //cập nhật tổng giá cho giỏ hàng.
           tb.Rows[i]["TongGia"] = g * soluong;
        }
        //load dữ liệu lại cho Gridview
        GridView1.DataSource = tb;
        GridView1.DataBind();
        //hiển thị tổng tiền.
        lbltongtien.Text = tongtien(tb).ToString();
    }
Đặc biệt hàm trả về tổng số tiền:
public float tongtien(DataTable tb)
    {
        float tt = 0;
        for (int i = 0; i < tb.Rows.Count; i++)
        {
            tt=tt + float.Parse(tb.Rows[i]["TongGia"].ToString());
        }
        return tt;
    }
Tạo Lớp GioHang.cs để thực hiện các phương thức như Thêm, Xóa, Sửa, Hiển thị:
using System;
using System.Data;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;

/// <summary>
/// Summary description for Giohang
/// </summary>
public class Giohang
{
    //Lam thu gio hang voi datatable
    DataTable tb = new DataTable();

    public Giohang()
    {
        //if (tb.Columns == null)
        {
            tb.Columns.Add("AnhSP");
            tb.Columns.Add("TenSP");
            tb.Columns.Add("SoLuong");
            tb.Columns.Add("Gia");
            tb.Columns.Add("TongGia");
            tb.Columns.Add("MaSP");
            tb.Columns.Add("MaNhanHieu");
        }
    }

    public DataTable getTable()
    {
        return this.tb;
    }

    public void setTable(DataTable tb)
    {
        this.tb = tb;                
    }
    //phuong thuc them 1 san pham moi vao gioi hang
    public DataTable addToShoppingCart(string maNhanHieu, string tenSP, string maSP, string anhSP, double soLuong, double gia)
    {
        bool kiemTra = false;
        if (tb.Rows.Count != 0)
        {
            foreach (DataRow dr in tb.Rows)
            {
                if (dr[1].ToString().Equals(tenSP))
                {                    
                    dr[2] = double.Parse(dr[2].ToString()) + 1;
                    dr[3] = gia;
                    dr[4] = (double.Parse(dr[2].ToString())*gia).ToString();
                    dr[5] = maSP;
                    dr[6] = maNhanHieu;
                    kiemTra = true;
                }               
            }
            if (!kiemTra)
            {
                DataRow row = tb.NewRow();
                row[0] = anhSP;
                row[1] = tenSP;
                row[2] = soLuong;
                row[3] = gia.ToString();
                row[4] = gia * soLuong;
                row[5] = maSP;
                row[6] = maNhanHieu;
                tb.Rows.Add(row);
            }
        }
        else
        {
            DataRow row = tb.NewRow();
            row[0] = anhSP;
            row[1] = tenSP;
            row[2] = soLuong;
            row[3] = gia.ToString();
            row[4] = gia * soLuong;
            row[5] = maSP;
            row[6] = maNhanHieu;
            tb.Rows.Add(row);
        }
        return tb;
    }

    public DataTable delete(DataTable datatable, string maSP)
    {
        DataTable tb = datatable;
        foreach (DataRow row in tb.Rows)
        {
            if (maSP.Equals(row[5].ToString()))
            {
                tb.Rows.Remove(row);
                break;
            }
        }
        return tb;
    }

    public DataTable upDate(DataTable datatable, double soLuong, string maSP)
    {
        DataTable tb = datatable;
        foreach (DataRow row in tb.Rows)
        {
            if(maSP.Equals(row[5].ToString()))
            {
                row[2] = soLuong;
                row[4] = double.Parse(row[3].ToString()) * soLuong;
            }
        }
        return tb;
    }

}

Nguồn bài viết: DOTNET.VN

BÌNH LUẬN BÀI VIẾT

Bài viết mới nhất

LIKE BOX

Bài viết được xem nhiều nhất

HỌC HTML