How to use the standard - ptcdb.edu.ps€¦ · Murach's ASP.NET 4.5/C#, C6 © 2013, Mike Murach &...

Murach's ASP.NET 4.5/C#, C6 © 2013, Mike Murach & Associates, Inc. Slide 1

Chapter 6

How to use the standard server controls


Common attributes of list box controls Rows

SelectionMode

Common attributes of list items Text

Value

Selected


The aspx for a list box <asp:ListBox ID="lstContactVia" runat="server"

SelectionMode="Multiple">

<asp:ListItem Selected="True">Twitter</asp:ListItem>

<asp:ListItem>Facebook</asp:ListItem>

<asp:ListItem Value="Text">Text

Message</asp:ListItem>

<asp:ListItem>Email</asp:ListItem>

</asp:ListBox>


The Collection Editor for creating and editing lists


Common properties of list controls

SelectedItem

SelectedIndex

SelectedValue

A common event of all list controls SelectedIndexChanged


The aspx code for a drop-down list <asp:DropDownList ID="ddlDay" runat="server">

<asp:ListItem Value="1">Sunday</asp:ListItem>

<asp:ListItem Value="2">Monday</asp:ListItem>

<asp:ListItem Value="3">Tuesday</asp:ListItem>

<asp:ListItem Value="4">Wednesday</asp:ListItem>

<asp:ListItem Value="5">Thursday</asp:ListItem>

<asp:ListItem Value="6">Friday</asp:ListItem>

<asp:ListItem Value="7">Saturday</asp:ListItem>

</asp:DropDownList>


Code that gets the value of the selected item in the drop-down list

int dayNumber = Convert.ToInt32(ddlDay.SelectedValue);

Code that gets the text for the selected item string dayName = ddlDay.SelectedItem.Text;

Code that uses the SelectedIndexChanged event protected void ddlDay_SelectedIndexChanged(

object sender, EventArgs e)

{

int dayNumber =

Convert.ToInt32(ddlDay.SelectedValue);

}


Common property of a list control

Items

Common property of a ListItemCollection object Count

Common indexer of a ListItemCollection object [integer]


Common methods of a ListItemCollection object

Add(string)

Add(ListItem)

Insert(integer, string)

Insert(integer, ListItem)

Remove(string)

Remove(ListItem)

RemoveAt(integer)

Clear()


C# code that loads items into a drop-down list using strings

for (int i = 50; i <= 500; i += 50)

{

ddlMonthlyInvestment.Items.Add(i.ToString());

}

C# code that loads items into a drop-down list using ListItem objects

ddlDay.Items.Add(New ListItem("Sunday", "1"));

ddlDay.Items.Add(New ListItem("Monday", "2"));

ddlDay.Items.Add(New ListItem("Tuesday", "3"));


Attributes for formatting radio button and check box lists

RepeatLayout

RepeatDirection

RepeatColumns


A check box list and a radio button list in a browser


The aspx code for the check box list Please let me know about:

<asp:CheckBoxList ID="cblAboutList" runat="server"

RepeatDirection="Horizontal">

<asp:ListItem Value="New" Selected="True">

New products</asp:ListItem>

<asp:ListItem Value="Special">

Special offers</asp:ListItem>

<asp:ListItem Value="Revisions">

New editions</asp:ListItem>

</asp:CheckBoxList>

A statement that checks if the first item in a check box list is selected

if (cblAboutList.Items[0].Selected) ...


The aspx code for the radio button list Please contact me via:

<asp:RadioButtonList ID="rblContactVia" runat="server" >

<asp:ListItem Selected="True">Twitter</asp:ListItem>


</asp:RadioButtonList>

A statement that gets the value of the selected item in a radio button list

customer.ContactVia = rblContactVia.SelectedValue;


A CheckOut page with standard server controls


The head section in the HTML for the page <head runat="server">

<title>Chapter 6: Shopping Cart</title>

<link href="Styles/Main.css" rel="stylesheet" />

<link href="Styles/CheckOut.css" rel="stylesheet" />

</head>


The aspx code for the form on the CheckOut page <form id="form1" runat="server" DefaultFocus="txtEmail1"

DefaultButton="btnCheckOut">

<h2>Contact information</h2>

<label>Email: </label>

<asp:TextBox ID="txtEmail1" runat="server"

CssClass="entry" TextMode="Email" >

</asp:TextBox><br />

<label>Email Re-entry: </label>

<asp:TextBox ID="txtEmail2" runat="server"

CssClass="entry" >

</asp:TextBox><br />

<%-- labels and text boxes for first name, last name,

and phone --%>


The aspx code for the CheckOut form (cont.) <h2>Billing address</h2>

<%-- labels and text boxes for address and city --%>

<label>State: </label>

<asp:DropDownList ID="ddlState" runat="server"

CssClass="entry" AppendDataBoundItems="True"

DataSourceID="SqlDataSource1"

DataTextField="StateName"

DataValueField="StateCode">

<asp:ListItem Text="" Value=""

Selected="True"></asp:ListItem>

</asp:DropDownList><br />

<asp:SqlDataSource ID="SqlDataSource1" runat="server"

ConnectionString=

"<%$ ConnectionStrings:HalloweenConnection %>"

SelectCommand="SELECT [StateCode], [StateName]

FROM [States]

ORDER BY [StateCode]">

</asp:SqlDataSource>


The aspx code for the CheckOut form (cont.) <label>Zip code: </label>

<asp:TextBox ID="txtZip" runat="server"

CssClass="entry"

MaxLength="5"></asp:TextBox>

<h2>Optional data</h2>

<div id="optionalData">

Please let me know about:

<asp:CheckBoxList ID="cblAboutList"

runat="server" RepeatColumns="2">

<asp:ListItem Value="New">

New products</asp:ListItem>

<asp:ListItem Value="Special">

Special offers</asp:ListItem>

<asp:ListItem Value="Revisions">

New editions</asp:ListItem>

<asp:ListItem Value="Local">

Local events</asp:ListItem>

</asp:CheckBoxList>


The aspx code for the CheckOut form (cont.) Please contact me via:

<asp:RadioButtonList ID="rblContactVia"

runat="server" RepeatDirection="Horizontal">

<asp:ListItem Selected="True">Twitter

</asp:ListItem>


<asp:ListItem Value="Text">Text Message

</asp:ListItem>

<asp:ListItem>Email</asp:ListItem>

</asp:RadioButtonList>

</div>


The aspx code for the CheckOut form (cont.) <asp:Button ID="btnCheckOut" runat="server"

Text="Check Out" CssClass="button"

OnClick="btnCheckOut_Click" />

<asp:Button ID="btnCancel" runat="server"

Text="Cancel Order" CausesValidation="False"

OnClick="btnCancel_Click" CssClass="button" />

<asp:LinkButton ID="lbtnContinueShopping"

runat="server" PostBackUrl="~/Order.aspx"

CausesValidation="False">Continue Shopping

</asp:LinkButton>

</form>


The code-behind file for capturing the data public partial class CheckOut : System.Web.UI.Page

{

private Customer customer;

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

customer = (Customer)Session["Customer"];

this.LoadCustomerData();

}

}

protected void btnCheckOut_Click(


{

if (Page.IsValid)

{

this.GetCustomerData();

Response.Redirect("~/CheckOut2.aspx");

}

}


The code-behind file for capturing the data (cont.) protected void btnCancel_Click(


{

Session.Remove("Cart");

Session.Remove("Customer");

Response.Redirect("~/Order.aspx");

}


The code-behind file for capturing the data (cont.) private void LoadCustomerData()

{

if (customer != null)

{

txtFirstName.Text = customer.FirstName;

// load data into other text boxes

// from customer object

ddlState.SelectedValue = customer.State;

rblContactVia.SelectedValue =

customer.ContactVia;

cblAboutList.Items[0].Selected =

customer.NewProductsInfo;


customer.SpecialPromosInfo;


customer.NewRevisionsInfo;


customer.LocalEventsInfo;

}

}


The code-behind file for capturing the data (cont.) private void GetCustomerData()

{

if (customer == null)

customer = new Customer();

customer.FirstName = txtFirstName.Text;

// get data from the other text boxes and

// load into customer object

customer.State = ddlState.SelectedValue;

customer.ContactVia = rblContactVia.SelectedValue;

customer.NewProductsInfo =

cblAboutList.Items[0].Selected;

customer.SpecialPromosInfo =


customer.NewRevisionsInfo =


customer.LocalEventsInfo =


Session["Customer"] = customer;

}

}


Other standard server controls that you may want to use

Calendar

AdRotator

Wizard

MultiView

View

Panel


Three steps of a Wizard control


The starting aspx for a Wizard control <asp:Wizard ID="Wizard1" runat="server"

ActiveStepIndex="0">

<WizardSteps>

<asp:WizardStep runat="server" Title="Step 1">

<h2>Contact information</h2>

...

</asp:WizardStep>


<h2>Shipping method</h2>

...

</asp:WizardStep>


<h2>Credit card information</h2>

...

</asp:WizardStep>

</WizardSteps>

</asp:Wizard>


Extra 6-1 Build a Reservation form

How to use the standard - ptcdb.edu.ps€¦ · Murach's ASP.NET 4.5/C#, C6 © 2013, Mike Murach &...

Documents

Transcript of How to use the standard - ptcdb.edu.ps€¦ · Murach's ASP.NET 4.5/C#, C6 © 2013, Mike Murach &...