Current Popular IT IPertemuan 3

Matakuliah : T0403/Current Popular IT ITahun : 2008

Learning Outcomes

• Learner can make a simple web page using standard controls

• Learner can do a simple validation using validation controls

• Learner can make a rich user interface using rich controls

• Learner can make web that communicate with user’s browser

Bina Nusantara Copyright © Surya Sujarwo 2008

Material Outline

• Using Standard Controls• Using Validation Controls• Using Rich Controls• Server Controls• Server Control Basics• Communicating with the Browser

Bina Nusantara Copyright © Surya Sujarwo 2008

Using Standard Controls

• Label Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• Literal Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• Literal Controls (continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Support HTML / XHTML

Not support HTML / XHTML

Using Standard Controls (Continue…)

• TextBox Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• CheckBox and Button Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• RadioButton Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• LinkButton and ImageButton Controls, Label’s AssociatedControlID

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• Image Controls and Default Button

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• ImageMap Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Standard Controls (Continue…)

• Panel and HyperLink Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Validation Controls

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Validation Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Validation Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Validation Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Validation Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Validation Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Rich Controls

• Setting Folder Permissions:

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

• AdList.xml

Using Rich Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Rich Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Rich Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Using Rich Controls (Continue…)

Bina Nusantara References: ASP.NET 3.5 Unleashed (Stephen Walther, 2008)

Server Controls

• Postback– Server side:– Client side:– Generated script on client:

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

Server Controls (Continue…)

• Data Binding– Allow to bind a property of a control to a data source

such as a field in database.

• Web Server Controls– Provide a type-safe object model to program against on

the server.– They do not map HTML element directly instead render

HTML elements when a page is processed, provides an abstraction from HTML controls, making a developer doesn’t need to be an expert in HTML to develop ASP.NET pages.

– Contains many controls such as: Label, Literal, Button, TextBox, etc.

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

Server Controls (Continue…)

• CheckBoxList Controls– Server:

– Client:

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

Server Controls (Continue…)

• RadioButtonList Controls– Server:

– Client:

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

Server Controls (Continue…)

• HTML Server Controls– Any HTML element on an ASP.NET page can be converted

into an HTML Server Control using runat attribute of the HTML element and set it to “server”.

– Other element that not in the table is using HtmlGenericControl.

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

CONTROLS DERIVED FROM HTMLCONTAINER

CONTROLS DERIVED FROM

HTMLINPUTCONTROL

CONTROLS DERIVED FROM HTMLIMAGE

HtmlAnchor HtmlInputButton (no derived controls)

HtmlButton HtmlInputCheckBox

HtmlForm HtmlInputFile

HtmlGenericControl HtmlInputHidden

HtmlSelect HtmlInputImage

HtmlTable HtmlInputRadioButton

HtmlTableCell HtmlInputText

HtmlTableRow

HtmlTextArea

Server Control Basics

• All server controls derived from System.Web.UI.Control base class.

• Control Properties– Every Server Control expose its properties to ASP.NET and

easily view in properties window of visual studio.

• Control Methods– The second features that exposed by a server control.

• Control Events– Provides a mechanism to notify clients of state changes inside

the control.

• The Root Controls– Factored in three primary namespaces: System.Web.UI,

System.Web.UI.HtmlControls, and System.Web.UI.WebControls

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

Server Control Basics (Continue…)

– The major namespace of ASP.NET under System.Web.UI

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

Server Control Basics (Continue…)

• The System.Web.UI Namespace– Contain the Control class (mandatory parent class for all

controls)

• The System.Web.UI.HtmlControls Namespace– Take existing HTML control into server controls

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

Server Control Basics (Continue…)

HTML Tag HTML Server Control

<form> HtmlForm

<input type="text"> HtmlInputText

<input type="password"> HtmlInputText

<input type="radio"> HtmlInputRadioButton

<input type="checkbox"> HtmlInputCheckBox

<input type="submit"> HtmlInputButton

<input type="hidden"> HtmlInputHidden

<input type="reset"> HtmlInputButton

<input type="image"> HtmlInputImage

<input type="file"> HtmlInputFile

<button> HtmlButton

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

Server Control Basics (Continue…)

HTML Tag HTML Server Control

<select> HtmlSelect

<textarea> HtmlTextArea

<img> HtmlImage

<a> HtmlAnchor

<table> HtmlTable

<tr> HtmlTableRow

<td> HtmlTableCell

All other tags HtmlGenericControl

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

Server Control Basics (Continue…)

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

• The System.Web.UI.WebControls Namespace

Server Control Basics (Continue…)

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

HTML Tag Simple Web Control

<input type="text"> TextBox with TextMode=Single

<input type="password"> TextBox with TextMode=Password

<textarea> TextBox with TextMode=MultiLine

<input type="radio"> RadioButton

<input type="checkbox"> CheckBox

<input type="submit"> Button

<input type="image"> ImageButton

<button> Button

<select> DropDownList

<select size=3> SelectList with Rows=3

<textarea> HtmlTextArea

Server Control Basics (Continue…)

Bina Nusantara References: ProASP.NET 3.5 Server Controls and AJAX Components(Rob Cameron and Dale Michalk, 2008)

HTML Tag Simple Web Control

<img> Image

<a> HyperLink, LinkButton

<table> Table

<tr> TableRow

<td> TableCell

<table> Panel

<span> Label

Communicating with the Browser

• The Response Object– The class is HttpResponse.– Used to send data to the client.– Can be used to redirecting the client to another resource

on the Web.

• Generating Content Programmatically

• Redirection

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

• Cookies– Class that related to cookies: HttpCookie,

HttpCookieCollection, HttpResponse and HttpRequest

Communicating with the Browser

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

Communicating with the Browser

Bina Nusantara References: Developing Web Applications with ASP.NET and C# (Hank Meyne and Scott Davis, 2002)

• Query String and Forms Collections– To passing parameters between pages.– Query String is for GET method of the form– Forms is for POST method of the form

That’s AllThank You for the Attention

Bina Nusantara