Back-end Management Tasks for an ASP.NET AJAX Server-Centric Based Online Shopping Website - Adding New Product

(Page 5 of 6 )

Adding a New Product

Before we start to discuss this function, let’s first see a snapshot of "ProductMain.aspx" (Figure 30) which is captured when the "Books" node is clicked.

Figure 30—one of the run-time snapshots for product management

Now, when the user clicks the "Add a New Product" button at the bottom, he will be navigated to another page, "AddProduct.aspx." The following Figure 31 shows one of its run-time snapshots.

Figure 31—one of the run-time snapshot for adding product

In designing this page, we’ve only used a little AJAX magic, as indicated from the above figure. For the user to more easily enter datetime data we provide him with an ASP.NET Calendarcontrol. How do we pop up the calendar control? One of the solutions is to resort to the ASP.NET AJAX Toolkit control named PopupControlExtender. How do we achieve the partial update effect when the user selects a new datetime from the calendar? For this, of course, we should seek help from the UpdatePanel.

Now, let’s leap over the page initialization and examine the adding function. The following code shows the related click event handler for the "OK" button.

protected void SureBtn_Click(object sender,EventArgs e){

int nMaxPictureID = -1;

//first insert image data into Pictures table then insert into Product
with the known PictureID

if (FileUpload1.PostedFile != null&& FileUpload1.PostedFile.FileName != "")

{

byte[] myimage = new byte[FileUpload1.PostedFile.ContentLength];

HttpPostedFile Image = FileUpload1.PostedFile;

Image.InputStream.Read(myimage, 0, (int)
FileUpload1.PostedFile.ContentLength);

Picture pic = new Picture();

try{

nMaxPictureID=pic.AddPicture("Image for product " + Name.Text,
FileUpload1.PostedFile.ContentType, myimage);

}

catch (SqlException SQLexc) {

Response.Write("Insert Failed. Error Details are: " + SQLexc.ToString());

return;

}

}

Product product = new Product();

///add data

product.AddProduct(Name.Text,nCategoryID,Desn.Text,Sell.Text,

DateTime.Parse(CreateDate.Text),DateTime.Parse(SellInDate.Text),

Unit.Text,Int32.Parse(Quantity.Text),Int32.Parse(Upper.Text),

Int32.Parse(Lower.Text),Decimal.Parse(InPrice.Text),

Decimal.Parse(OutPrice.Text), nMaxPictureID, Remark.Text);

///display the info of the operating result

Response.Write("<script>window.alert('You have succeeded in adding data.')
</script>");

}

There are three things happening here. First, by clicking the FileUploadcontrol we browse and get the image file name. Then we dissect it, abstract the image data, store them into a byte array, and finally by invoking the AddPicture methodof the Picture classwe write the image data into the imagetyped field in the Pictures table. Second, we create an instance of the Product classand by calling its AddProductmethod we finally store all of the product info in the server-side database. Third, after everything is okay, we call "Response.Write(…)" 

Will anything wrong be triggered due to the above UpdatePanel? No, it won’t. This is because it’s the last sentence—before this invocation all the possible asynchronous postbacks have taken place.

When you click the "Edit" hyperlink in the above Figure 31, you will be navigated to another page, "EditProduct.aspx," to modify the selected product (where of course you can change the image file). Since the general logic of it is quite similar to the above "AddProduct.aspx" page, we don’t plan to examine the modifying function any further.

Next: About Viewing Products >>
 

More ASP.NET Articles
More By Xianzhong Zhu

Comments On: Back-end Management Tasks for an ASP.NET AJAX Server-Centric Based Online Shopping Website

>>> Be the FIRST to comment on this article!