CSC 415/515 ASP.NET LAB AND HOMEWORK 7

yelpframeSecurity

Nov 4, 2013 (3 years and 7 months ago)

78 views

CSC 415/515 ASP.NET LAB AND HOMEWORK 7
GODFREY C.MUGANDA
1.ASP.NET Lab:Online Pizza Store
The application has 2 pages:
(1) Default.aspx:an order form
(2) CheckOut.aspx:an order-conrmation-and-goodbye page.
The order form uses a group of radiobuttons in a panel to enable the visitor to
select a crust.Choices for a crust,and the associated prices are
thin $1
medium $2
thick $3
The page also uses a group of checkboxes in a panel to enable the visitor to select
a set of toppings:
mushrooms $4
pepperoni $5
sausage $6
In addition to the radiobuttons and checkboxes,the page has a literal control
at the bottom that changes to re ect the currently selecteld choices.There is
also a readable-only textbox that continually updates to re ect cost of the current
selections.These updates,which occur in response to user interaction,are handled
by server-side code.(In a realistic applications,these updates should be handled
by client-side Javascript because they do not require data stored on the server.)
Finally,the page has a link labelled Check Out at the bottom that sends the visitor
to an order-conrmation and goodbye page.
Do this lab by following these steps:
(1) Open a website project.
(2) Working on the default.aspx page,Add a Panel control,set its ID to
CrustPanel,and set its GroupingText property to\Select a Crust."
(3) Add a second Panel,set its ID to ToppingsPanel,set its GroupingText
to\Select Toppings."
(4) We will use tables to align the radio boxes and price labels that we want
to add to the form.Add a Table control inside of CrustPanel and set its
ID to CrustTable.Click on its Rows Collections Property and to add some
rows to the table.For Row 0,under the Misc group,locate and click on
the Cells Collection.Add two cells.
(5) Repeat the procedure to add 2 more rows to the table.The panel should
now look like this
<asp:Panel ID="CrustPanel"runat="server"
1
2 GODFREY C.MUGANDA
GroupingText="Select a Crust">
<asp:Table ID="CrustTable"runat="server">
<asp:TableRow runat="server">
<asp:TableCell runat="server"></asp:TableCell>
<asp:TableCell runat="server"></asp:TableCell>
</asp:TableRow>
<asp:TableRow runat="server">
<asp:TableCell runat="server"></asp:TableCell>
<asp:TableCell runat="server"></asp:TableCell>
</asp:TableRow>
<asp:TableRow runat="server">
<asp:TableCell runat="server"></asp:TableCell>
<asp:TableCell runat="server"></asp:TableCell>
</asp:TableRow>
</asp:Table>
</asp:Panel>
(6) Insert some spaces between the start and ending tags of table cell so we have
room to insert controls or text.Add radio buttons to the\crust"table,
putting a radio button in the rst cell of each row and a price in the second
cell.Set the GroupName property of all radiobuttons to\CrustGroup".
(7) We now want to add the checkboxes that will select toppings.Repeat the
procedure,suitably modied,for the panel that is to hold the toppings
information.
(8) From the Build menu,select Build the Solution,and then select Start
without Debugging from the Debug menu to see the eect.
(9) Add a Literal control t just below the toppings panel to show the current
selections.Set its ID to"CurrentSelections"and its Text property to
\none."
(10) Now add a TextBox control below the toppings panel.Label the textbox
\Total Cost"and set the ReadOnly property to true.Set its ID to
\CostTextBox."
(11) We need to force each radiobutton and checkbox to postback whenever it
experiences a CheckChanged event.Select each of the radiobuttons and
checkboxes in succession and set its AutoPostBack property to true.
It is now time to add some event handlers.Radiobuttons and checkboxes have
an Checked property that can be either true or false,and an oncheckedchanged
property that can be used to assign event handlers.We will use one event handler
for all the checkboxes and radio buttons.
Modify the Default.aspx.cs le so that it looks like this
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class _Default:System.Web.UI.Page
{
protected void Page_Load(object sender,EventArgs e)
{
}
protected void choices_CheckedChanged(object sender,EventArgs e)
CSC 415/515 ASP.NET LAB AND HOMEWORK 7 3
{
}
}
Now modify the method so it looks like this
protected void choices_CheckedChanged(object sender,EventArgs e)
{
StringBuilder selected = new StringBuilder("Crust:");
RadioButton []crustChoices = {thin,medium,thick};
CheckBox []toppingsChoices = {mushrooms,pepperoni};
float totalCost = 0;
//process the crust selection
foreach (RadioButton rb in crustChoices)
{
if (rb.Checked)
{
selected.Append(rb.Text +"");
break;
}
}
selected.Append(";Toppings:");
//process the toppings selection
foreach (CheckBox cb in toppingsChoices)
{
if (cb.Checked)
{
selected.Append(cb.Text +"");
}
}
//set the results so the user can see them
CurrentSelectionsLiteral.Text = selected.ToString();
CostTextBox.Text = totalCost.ToString();
}
Tie this event handler to all the oncheckchanged events of all radio buttons and
check boxes.This is done by modifying all checkbox and radiobutton tags by adding
an oncheckedchanged attribute.For example,the rst radiobutton gets modied
as follows:
<asp:TableCell runat="server">
<asp:RadioButton ID="thin"runat="server"Text="Thin"
AutoPostBack="True"Checked="True"GroupName="Crusts"
oncheckedchanged ="choices_CheckedChanged"/>
</asp:TableCell>
Finally,we want to keep track of the changing cost as the user is selecting the
various ingredients of the pizza.We will use global.asax le to initialize prices of
ingredients and store them in the application state.
4 GODFREY C.MUGANDA
Go to the Website menu item,then select Add New Item and nally,select Global
Application Class.Modify the le so the Application
Start method sets prices
of the various ingredients into the application state:
void Application_Start(object sender,EventArgs e)
{
Application["Thin"] ="1.00";
Application["Medium"] ="2.00";
Application["Thick"] ="3.00";
Application["Mushrooms"] ="4.00";
Application["Pepperoni"] ="5.00";
}
Now return to the Default.aspx.cs le and modify the code in the event handler
method
choices_CheckedChanged
so it keeps track of total cost.For example,the amount for an ingredient selected
by a radiobutton can be added to the total cost like this:
totalCost += float.Parse((String)Application[rb.Text]);
Finally,we need to add the link to the Good bye page.To do this dd a LinkButton
Control at the very bottomof the page,after the CostTextbox control.Set the Text
property of the LinkButton to"Check Out"and its ID to"CheckOut".Select the
LinkButton control,then in its properties,select the Event page and double-click
on its Click event.This will add a method
protected void CheckOut_Click(object sender,EventArgs e)
{
}
to the code-behind le.Leave it as is,for now,and using the Website menu,use
Add New Item to add a new Web form to the project:call it\Checkout.aspx."
Add a literal control and a cost textbox to this new page so its source code looks
like this:
<body>
<form id="form1"runat="server">
<div>
Your Selections:
<asp:Literal ID="SelectedChoicesLiteral"
runat="server"></asp:Literal> <br/>
Your Cost:
<asp:TextBox ID="CostTextBox"runat="server">
</asp:TextBox>
Goodbye.It is a pleasure saving you.
</div>
</form>
</body>
Now return to the Default.aspx.cs le and modify the CheckOut
Click method
so that,when the Check Out LinkButton is clicked,it saves information about
CSC 415/515 ASP.NET LAB AND HOMEWORK 7 5
the current selections and cost in the Session state object,and then redirects the
requesting browser to the CheckOut.aspx page"
protected void CheckOut_Click(object sender,EventArgs e)
{
Session["selected"] = CurrentSelectionsLiteral.Text;
Session["cost"] = CostTextBox.Text;
Response.Redirect("CheckOut.aspx");
}
Now we need to return to the CheckOut.aspx page.In the Solutions Explorer,
expand the node for this page to reveal the CheckOut.aspx.cs code-behing page.
Double-click on that node to open the le in the editor.We want to modify the
selected choices literal and cost textbox to display the information stored in the
session.We do this by modifying the Page
Load method that is automatically
called when ASP.NET loads the page:
public partial class Checkout:System.Web.UI.Page
{
protected void Page_Load(object sender,EventArgs e)
{
SelectedChoicesLiteral.Text = (String)Session["selected"];
CostTextBox.Text = (String)Session["cost"];
}
}
The method does that be retrieving and displaying the information stored in the
Session state object.
2.Homework 7
Modify this web application as follows.First,the application should display a
table of the 5 ingredients and prices at the top.Then,the application should use
RadioButtonList and CheckBoxList controls for the crust and toppings selections,
repectively.The RadioButtonList and CheckBoxList have ListItem subcontrol
that have Text and Value properties,use these to associate an ingredient,such as
Thin,with its price,1.00.You should not need a table for alignment if you do this.
Finally,because each list item carries the cost of its ingredient,you can eliminate
the global.asax le.
Zip up the entire project folder and submit by email by Monday morning 9:00 pm,
which is when I will start grading.No submissions will be accepted after Monday
9:00 am.