shopping cart. search and display product information add item to cart view cart contents check out

26
Shopping Cart

Post on 22-Dec-2015

226 views

Category:

Documents


1 download

TRANSCRIPT

Shopping Cart

Shopping Cart

• Search and display product information

• Add item to cart

• View cart contents

• Check out

Shopping Cart Example

• Database:– WebCustomer: CustID, CustName, Addr, Phone– WebOrder: OrderID, CustID, OrderDate, CreditCardType, CreditCardNo

– WebLine: OrderID, PID, Qty

– WebProduct: Pid, Pname, Price, UnitsInStock

• Session ID is used for OrderID– Other choices? Visitor Counter?

• Login user using cookie• Each item is modeled as a class, and items are collected in

a collection before added to the database.

Implementing Shopping Cart as Class

• Shopping Cart Properties:– Public oid As String

– Public cid As String

– Public ODate As DateTime

– Public CreditCardType As String

– Public CreditCardNo as String

– Public CollCartLine As New ArrayList()

• Methods: AddItem, DeleteItem, ViewCart, CheckOut

• DetailLine Properties:– OID

– PID

– Pname

– Price

– Qty

– Amount = Qty * Price

Adding Buttons to a Bound DataGrid

• Use DataGrid/Columns editor– Bound columns, Button columns, Template columns

• Button event procedures– CodeWIndow/DataGrid

• DeleteCommand

• EditCommand

• CancelCommand

• UpdateCommand

– e As System.Web.UI.WebControls.DataGridCommandEventArgs

Edit/Delete Customer Record

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load If Not Page.IsPostBack Then OleDbDataAdapter1.Fill(DataSet31, "customer") DataGrid1.DataBind() Session("MyDs") = DataSet31 Else DataSet31 = Session("MyDs") End If End Sub Private Sub DataGrid1_EditCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.EditCommand DataGrid1.EditItemIndex = e.Item.ItemIndex DataGrid1.DataBind() End Sub

Private Sub DataGrid1_UpdateCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.UpdateCommand

DataSet31.Tables("Customer").Rows(e.Item.ItemIndex).Item("rating") = CType(e.Item.Cells(4).Controls(0), TextBox).Text DataGrid1.EditItemIndex = -1 DataGrid1.DataBind() Session("MyDs") = DataSet31 End Sub Private Sub DataGrid1_CancelCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.CancelCommand DataGrid1.EditItemIndex = -1 DataGrid1.DataBind() End Sub

Private Sub DataGrid1_DeleteCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.DeleteCommand

DataSet31.Tables("customer").Rows.RemoveAt(e.Item.ItemIndex)

DataGrid1.DataBind() Session("MyDs") = DataSet31 End Sub

• DeleteCommand: DataSet31.Tables("customer").Rows.RemoveAt(e.Item.ItemIndex)

• Edit Command:– DataGrid1.EditItemIndex = e.Item.ItemIndex

• Cancel command:– DataGrid1.EditItemIndex = -1

• Update command: DataSet31.Tables("Customer").Rows(e.Item.ItemIndex).Item("rating") =

CType(e.Item.Cells(4).Controls(0), TextBox).Text– DataGrid1.EditItemIndex = -1–

• Note: CType(e.Item.Cells(4).Controls(0), TextBox)

DataGrid Button Commands Examples

Rearrange the Fields Order

• Cancel the “Create columns automatically at run time” option

• Then add fields to the selected columns box

• Change order using button.

DataGrid Button Commands Example Dim objDataSet As New DataSet Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load 'Put user code to initialize the page here If Not Page.IsPostBack Then Dim strConn As String = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source = c:\sales2k.mdb" Dim objConn As New OleDbConnection(strConn) Dim strSQL As String = "select pid,description,price from product;" Dim objAdapter As New OleDbDataAdapter(strSQL, objConn) objAdapter.Fill(objDataSet, "Product") DataGrid1.DataSource = objDataSet DataGrid1.DataMember = "Product" DataGrid1.DataBind() Session("MyDs") = objDataSet Else objDataSet = Session("MyDs") End If End Sub Private Sub DataGrid1_EditCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.EditCommand DataGrid1.EditItemIndex = e.Item.ItemIndex DataGrid1.DataSource = objDataSet DataGrid1.DataMember = "Product" DataGrid1.DataBind() End Sub

Private Sub DataGrid1_UpdateCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.UpdateCommand objDataSet.Tables("Product").Rows(e.Item.ItemIndex).Item("Price") = CDbl(CType(e.Item.Cells(4).Controls(0), TextBox).Text) DataGrid1.EditItemIndex = -1 DataGrid1.DataSource = objDataSet DataGrid1.DataMember = "Product" DataGrid1.DataBind() Session("MyDs") = objDataSet End Sub Private Sub DataGrid1_CancelCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.CancelCommand DataGrid1.EditItemIndex = -1 DataGrid1.DataSource = objDataSet DataGrid1.DataMember = "Product" DataGrid1.DataBind() End Sub Private Sub DataGrid1_DeleteCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.DeleteCommand objDataSet.Tables("Product").Rows.RemoveAt(e.Item.ItemIndex) DataGrid1.DataSource = objDataSet DataGrid1.DataMember = "Product" DataGrid1.DataBind() Session("MyDs") = objDataSet End Sub

Adding Textbox and Button and to a Bound DataGrid

• DataGrid Properties/Columns editor:– Template column:

• HeaderText: This text will be used as column name

• Web Page’s HTML view:– Add ItemTemplate to the Template column tag– Add Control’s tag

• Event: ItemCommand

Example<asp:TemplateColumn HeaderText="Quantity">

<ItemTemplate>

<asp:TextBox id="txtQty" Width="70“ runat="server"></asp:TextBox>

</ItemTemplate>

</asp:TemplateColumn>

<asp:TemplateColumn HeaderText="AddToCart">

<ItemTemplate>

<asp:Button Text="AddToCart" Runat="server"></asp:Button>

</ItemTemplate>

</asp:TemplateColumn>

How to retrieve data from a cell in the selected row?

Private Sub DataGrid1_ItemCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.ItemCommand

• Response.Write(CType(e.Item.Cells(3).Controls(1), TextBox).Text)

• Response.Write(CType(e.Item.Cells(3).FindControl("txtQty"), TextBox).Text)

End Sub

Note: Cells(3).Controls(1)

Controls(0) is the cell itself, Controls(1) is the 2nd control in the cell.

If there are two buttons created by ItemTemplate, how to tell which button is clicked?

• Use the ItemCommand procedure• Private Sub DataGrid1_ItemCommand(ByVal

source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.ItemCommand

• If e.CommandSource.text = "View" Then• Response.Write("You click View button")• End If• If e.CommandSource.text = "Add" Then• Response.Write("You click Add button")• End If• End Sub

Binding Using View

• Example: Listbox to select price range

• Binding using code, not at design view.

• At design view, use dataGrid columns editor to:– Add BoundColumn and enter Data field

Binding Using ViewPrivate Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load If Not Page.IsPostBack Then OleDbDataAdapter1.Fill(DataSet31) Session("MyDs") = DataSet31 Else DataSet31 = Session("MyDs") End If End Sub Private Sub ListBox1_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ListBox1.SelectedIndexChanged Dim myView As New DataView myView = DataSet31.Tables("webProducts").DefaultView If ListBox1.SelectedIndex = 0 Then myView.RowFilter = "price<100" ElseIf ListBox1.SelectedIndex = 1 Then myView.RowFilter = "price>=100 and price <=300" Else myView.RowFilter = "price>300 " End If DataGrid1.DataSource = myView DataGrid1.DataBind() End Sub

ShopCart ClassPublic Class ShopCart Public oid As String Public cid As String Public ODate As DateTime Public CreditCardType As String Public CreditCardNo As String Public CollCartLine As New ArrayList() Public ReadOnly Property CartTotal() As Double Get Dim item As New CartLine Dim total As Double Dim itemIndex As Integer For Each item In CollCartLine total = total + item.price * item.qty Next CartTotal = total End Get End Property

AddItem MethodPublic Sub AddItem(ByVal line As CartLine) Dim item As New CartLine() Dim incart As New Boolean() incart = False If CollCartLine.Count > 0 Then For Each item In CollCartLine If item.pid = line.pid Then item.qty = line.qty incart = True Exit For End If Next End If If incart = False Then CollCartLine.Add(line) End If End Sub

Public Sub deleteItem(ByVal deleteIndex As Integer)

CollCartLine.RemoveAt(deleteIndex)

End SubPublic Sub checkOut()

Dim objLine As New CartLine()

Dim strSQL As String

Dim strConn As String

strConn = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source = c:\sales2k.mdb"

Dim objConn As New OleDbConnection()

objConn.ConnectionString = strConn

Dim objComm As New OleDbCommand()

objConn.Open()

objComm.Connection = objConn

objComm.CommandType = CommandType.Text

strSQL = "insert into weborder values ('" & oid & "', '" & cid & "', #" & ODate.ToString & "#, '" & CreditCardType & "','" & CreditCardNo & "')"

objComm.CommandText = strSQL

objComm.ExecuteNonQuery()

For Each objLine In CollCartLine

strSQL = "insert into webline values ('" & objLine.oid & "', '" & objLine.pid & "', " & CStr(objLine.qty) & ")"

objComm.CommandText = strSQL

objComm.ExecuteNonQuery()

Next

End Sub

End Class

Shopping Cart Detail LinePublic Class CartLine Private hiddenoid As String Private hiddenpid As String Private hiddenpname As String Private hiddenprice As Double Private hiddenqty As Integer Public Property oid() As String Get oid = hiddenoid End Get Set(ByVal Value As String) hiddenoid = Value End Set End Property Public Property pid() As String Get pid = hiddenpid End Get Set(ByVal Value As String) hiddenpid = Value End Set End Property

Public Property pname() As String Get pname = hiddenpname End Get Set(ByVal Value As String) hiddenpname = Value End Set End Property Public Property price() As Double Get price = hiddenprice End Get Set(ByVal Value As Double) hiddenprice = Value End Set End Property Public Property qty() As Integer Get qty = hiddenqty End Get Set(ByVal Value As Integer) hiddenqty = Value End Set End Property Public ReadOnly Property amount() As Double Get amount = qty * price End Get End PropertyEnd Class

AddToCart Button Event Procedure

Private Sub DataGrid1_ItemCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.ItemCommand

MyCart = Session("MyShopCart")

Dim objLine As New CartLine()

objLine.oid = Session.SessionID

objLine.pid = e.Item.Cells(0).Text

objLine.pname = e.Item.Cells(1).Text

objLine.price = CDbl(e.Item.Cells(2).Text)

objLine.qty = CInt(CType(e.Item.Cells(1).FindControl("tbox"), TextBox).Text)

MyCart.AddItem(objLine)

Response.Write("number of items in cart:" & CStr(MyCart.CollCartLine.Count))

End Sub

Delete Button Procedure

Private Sub DataGrid1_DeleteCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.DeleteCommand

myCart.deleteItem(e.Item.ItemIndex)

Session("MyShopCart") = myCart

DataGrid1.DataSource = myCart.CollCartLine

DataGrid1.DataBind()

txtAmount.Text = myCart.CartTotal.ToString

End Sub

CheckOut ProcedureDim MyCart As New ShopCart()

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

'Put user code to initialize the page here

MyCart = Session("MyShopCart")

End Sub

Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click

MyCart.oid = Session.SessionID

MyCart.cid = Session("cid")

MyCart.ODate = DateTime.Now()

MyCart.CreditCardType = RadioButtonList1.SelectedItem.Text

MyCart.CreditCardNo = TextBox1.Text

MyCart.checkOut()

Response.Write("<p align='center'><font size='5'><b>Thank you for shopping at My.Com</b></font></p>")

Session.Abandon()

End Sub