LOGIN NAME:

PASSWORD:

:: Web Services :: XWebCheckOut :: Implementation Guides ::

Build Your Own XML/SOAP Web Service Based Shopping Cart
Display Items Added To The Basket

The procedures in this implementation guide require that you have some knowledge of XML and ASP.NET web development with the Microsoft Visual Basic.NET development tool.

The steps in this "how-to" implementation guide are:

• Add a "Web Reference" to the XWebCheckOut Web Service
• Add a "Web Form" to the web application
• Write code in the "Codebehind" of the web form to retrieve the Basket's contents by consuming the XWebCheckOut Web Service
• Implement a DataGrid to display the items added to the Basket

To download the source code for this "how-to" implementation guide, as well as for additional hints and tips, please read our Final Notes.

Add a "Web Reference" to the XWebCheckOut Web Service

• In your web project, add a Web Reference to the XWebCheckOut web service. Here are 2 ways you can accomplish this:

  • Browse the Solution Explorer, right click on References and select Add Web Reference... from the drop down menu.
  • From the File Menu, select Project - Add Web Reference....

• The Add Web Reference pop-up window will open. In the URL textbox, enter the following URI:

  https://ws.xwebservices.com/XWebCheckOut/XWebCheckOut.asmx?wsdl

• Hit the Enter key or click the Go button located to the right of the URL textbox.
• Change the Web reference name to XWebCheckOut for easier reference.
• Click the Add Reference button to complete this step.

Add a "Web Form" to the Web Application

• In your web project, add a Web Form. This is the Web Form that will display the items added to the Basket. Here are 2 ways you can accomplish this:

  • Browse the Solution Explorer, right click the name of your project, and select Add - Add Web Form....
  • From the File Menu, select Project - Add Web Form....
• Change the Name textbox in the Add New Item pop-up provided to basket.aspx.

Write code in the "Codebehind" of the web form to retrieve the Basket's contents by consuming the XWebCheckOut Web Service

In the first "how-to" implementation guide of our Build Your Own XML/SOAP Web Service Based Shopping Cart series, every order is assigned an Order ID and the Order ID is then stored in a cookie. Using the Order ID stored in the cookie, in the Page_Load subroutine of the web form, we retrieve the Basket's contents by calling the LoadOrder SOAP method of the XWebCheckOut Web Service:

• Since the web service requires SOAP Headers for authentication purposes, we must first create a new instance of the class representing the SOAP Header and then populate the SOAP Header values:

  ' handle authentication
  Dim objAuth As New XWebCheckOut.AuthHeader
  objAuth.LoginName = "<my_login_name>"
  objAuth.Password = "<my_password>"

  NOTE***: Instead of hard-coding the LoginName and Password values, you may want to dynamically read them from the web.config file (LOGIN_NAME and PASSWORD must be added to the <AppSettings> section of the web.config file):

  objAuth.LoginName = System.Configuration.ConfigurationSettings.AppSettings("LOGIN_NAME")
  objAuth.Password = System.Configuration.ConfigurationSettings.AppSettings("PASSWORD")

• Next, we need to create a new instance of the proxy class and assign the SOAP Header object to the member variable of the proxy class representing the SOAP Header:

  ' create the XWebCheckOut web service proxy
  Dim objOrder As New XWebCheckOut.XWebCheckOut
  objOrder.AuthHeaderValue = objAuth

• We are now ready to call the method on the proxy class that communicates with the Web Service SOAP Method and returns the Order record we requested. Since the method returns the Order record in the form of an XML string, we load an XML DOM with it:

  ' load the xml string into a DOM
  Dim orderDOM As New System.Xml.XmlDocument
  orderDOM.LoadXml(objOrder.LoadOrder(Request.Cookies("OID").Value))

• In the previous implementation guide we stored the contents of the Basket as XML as well. We load another XML DOM with the Basket's contents:

  ' load another DOM with the contents of the Basket
  Dim basketDOM As New System.Xml.XmlDocument
  basketDOM.LoadXml(orderDOM.DocumentElement.SelectSingleNode("Basket/Contents").InnerText)

Implement a DataGrid to display the items added to the Basket

In the Code Editor, we need to declare a DataGrid. Next, we bind an XMLNodeList of all items added to the Basket to the DataGrid's DataSource. Here's how:

• Declare the DataGrid in the Code Editor:

  Protected dgItems As System.Web.UI.WebControls.DataGrid

• Bind the XMLNodeList representing the items added to the Basket to the DataGrid's DataSource and call the DataBind method:

  dgItems.DataSource =
     basketDOM.DocumentElement.SelectSingleNode("Items")
  dgItems.DataBind()

Finally, in the HTML Editor, we format the DataGrid to our liking and display the items:

<asp:DataGrid ID="dgItems" AutoGenerateColumns="False" BorderWidth="0" CellPadding="2" CellSpacing="2" Runat="server">
   <Columns>
      <asp:TemplateColumn>
         <HeaderTemplate></HeaderTemplate>
         <ItemTemplate>
<b>
<%# Container.DataItem.SelectSingleNode("Name").InnerText.ToUpper %>
</b><br />
<%# Container.DataItem.SelectSingleNode("Description").InnerText %><br />
<i>Price: $
<%# Container.DataItem.SelectSingleNode("Price").InnerText %>
</i>
         </ItemTemplate>
         <FooterTemplate></FooterTemplate>
      </asp:TemplateColumn>
   </Columns>
</asp:DataGrid>

Final Notes

The source code for this "how-to" implementation guide can be downloaded by clicking the link below (zip file, contains the source code for all "how-to" implementation guides for the XWebCheckOut Web Service)

XWebCheckOutClient.zip

Once the contents of the Basket are loaded into an XML DOM, customizing the web form becomes a breeze. The Total can be positioned anywhere on the form. Textboxes to update the item count, links to remove items, etc. can be added anywhere on the form as well.

Websites that need to display the Basket's contents on every page can use the exact same code except in a web user control instead of a web form.

It's always good practice to implement a Try...Catch... error handling technique to handle some or all possible errors that may occur while the code is executing. We strongly recommend that you implement such a technique.