Comment and Order Management for an ASP.NET AJAX Server-Centric Based Online Shopping Website

Welcome to the ninth part of an eleven-part series focused on building an online shopping web site. In this part you will learn to manage both product comments and orders.

Contributed by
Rating: 5 stars5 stars5 stars5 stars5 stars / 11
January 23, 2008
Rate this Article:
MEH MEH++


SEARCH ASP FREE
TOOLS YOU CAN USE

advertisement

A downloadable .rar file is available for this article.

Product Comment Management

The product comment management functionality is accomplished through the "CommentManage.aspx." Its total functionalities can be listed as follows:

  1. Show the comments in a table form. 
  2. Delete comments.
  3. View comments.


Interface

First, let’s take a look at the design-time snapshot for product comment management, as displayed in Figure 33.


Figure 33—the design-time snapshot for product comment management

As you can see from the above figure, only Ajax is leveraged. When the user clicks the "X" ImageButton in the GridView control to delete the selected comment, to give the user a very clear prompt asking whether or not to make the deletion, we use the ASP.NET AJAX Toolkit control namedConfirmButtonExtenderto pop up a dialog to gain this effect. Since the HTML code is very long, we’ll only look at the part directly related to what we're doing, as follows:

<asp:TemplateField HeaderText="Operation">

<ItemTemplate>

<asp:ImageButton id="deleteBtn" ImageUrl="~/images/delete.gif" AlternateText="Delete" runat="server"

CommandName="delete" CommandArgument='<%# DataBinder.Eval(Container.DataItem,"CommentID") %>'/>

<ajaxToolkit:ConfirmButtonExtender ID="ConfirmButtonExtender1" runat="server" TargetControlID="deleteBtn" ConfirmText="Are you sure to delete the selected items?">

</ajaxToolkit:ConfirmButtonExtender>

</ItemTemplate>

<ItemStyle Width="10%" BorderWidth="1px" HorizontalAlign="Center" />

<HeaderStyle HorizontalAlign="Center" />

</asp:TemplateField>

From the above code, you can easily find out how the ConfirmButtonExtendercontrol is attached to theXImageButton. Note that one of the benefits to using most of the ASP.NET AJAX Toolkit controls is that they are very easy to follow up, with no programming required. 

Since the coding behind is pretty easy to grasp and we still have a long way to travel we don’t plan to delve into this any more but leave this task to the sedulous readers.

Order Management


Order Management

This function is accomplished through the "OrderManage.aspx" page. As a whole, the functions can be enumerated as follows:

  1. Display the order in table form. 
  2. Submit the order. 
  3. View the order.
  4. View the products on the order.

Now, let’s look at the run-time snapshot, as shown in Figure 34.


Figure 34—the run-time snapshot of order management

Here, there is only a GridView control shown to the user with a few links at each line. If he clicks the order number or the "View Product" button he will be redirected to the "ViewOrder.aspx" page to view the detailed information about the order. In fact, there are two states on the "Order State" column, "Unsubmitted" and "Already Submitted." If the "Unsubmitted" state is shown, then a button titled "Submit Order" appears on the "Operation" column. Otherwise, this button is hidden and the "Order State" column is replaced with "Already Submitted" as displayed in Figure 34.

Initialization


Initialization

When the "OrderManage.aspx" page is initialized, the related OrderFormdata is bound to GridView "OrderView," i.e. showing the factual order data and its associated state.

protected void Page_Load(object sender, EventArgs e){

Session["UserID"] = 1;

///bind data to the control

if(!Page.IsPostBack) {

BindOrderData();

}

}

private void BindOrderData(){

///define the class that gets the data

OrderForm order = new OrderForm();

SqlDataReader dr = order.GetOrderFormByUser(Int32.Parse(Session["UserID"].ToString()));

///Set the control's data source

OrderView.DataSource = dr;

///bind data to the control

OrderView.DataBind();

///Close the database connection

dr.Close();

}

Since there are enough comments on nearly each line of code here, let’s continue to see how to commit the order.

Committing the Order


Committing the Order

When you click the "Submit Order" button on the "Operation" column in Figure 34. the corresponding order will be committed to the server-side database, and at the same time the "Order State" column state changes to "Already Submitted." This is accomplished entirely through the following code.

protected void OrderView_RowCommand(object sender,GridViewCommandEventArgs e)

{

if(e.CommandName == "commit"){

///commit order

OrderForm order = new OrderForm();

order.CommitOrderForm(Int32.Parse(e.CommandArgument.ToString()));

///rebind data to the control

BindOrderData();

Response.Write("<script>alert('" + "You have succeeded in committed this order. Please safekeep you data!" + "');</script>");

}

}

Here, we first find the "commit" command via the CommandNameargument of the GridViewCommandEventArgs parameter. Then the commit operation is started by calling the CommitOrderForm member functionof the OrderForm class. And at last, the order data is rebound to display the current state of the order.

blog comments powered by Disqus
ASP.NET ARTICLES

- Implementing ASP.NET 4.0 Page.MetaDescriptio...
- ASP.Net Development Tips
- Intro to Sessions in ASP.Net
- Google Maps API Introduction in ASP.NET usin...
- Creating an ASP.NET 3.5 Gridview Image Galle...
- Encrypt QueryString in ASP.NET 3.5 using VB....
- ASP.NET 3.5 Drop Down List Controls
- Connect to Access Database with ASP.Net
- Secure Audio Streaming with ASP.Net and Flash
- Dynamic Sitemap and Navigation in ASP.Net
- Implement Gzip and Deflate Compression in AS...
- Run ASP.Net in Ubuntu with Apache
- ASP.Net Mono Website Contact Forms
- ASP.Net URL Rewriting Methods
- Murach`s ASP.NET 4 Web Programming with C# 2...

ASP Web Hosting ASP.Net Web Hosting Windows Web Hosting
 
 
 

ASP Free Forums 
 RSS  Tutorials RSS
 RSS  Forums RSS
 RSS  All Feeds
Site Map 
Request Media Kit
Write For Us Get Paid 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Privacy Policy 
Support 


© 2003-2012 by Developer Shed. All rights reserved. DS Cluster 1 - Follow our Sitemap
Most Popular Topics
All ASP.Net Tutorials