Current Popular IT I Pertemuan 3 Matakuliah: T0403/Current Popular IT I Tahun: 2008.

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



• Literal Controls (continue…)


Support HTML / XHTML

Not support HTML / XHTML


• TextBox Controls



• CheckBox and Button Controls



• RadioButton Controls



• LinkButton and ImageButton Controls, Label’s AssociatedControlID



• Image Controls and Default Button



• ImageMap Controls



• Panel and HyperLink Controls


Using Validation Controls


Using Validation Controls (Continue…)


Using Rich Controls

• Setting Folder Permissions:


• AdList.xml

Using Rich Controls (Continue…)


Using Rich Controls (Continue…)


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.



• CheckBoxList Controls– Server:

– Client:



• RadioButtonList Controls– Server:

– Client:



• 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.


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



• 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



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



HTML Tag HTML Server Control

<select> HtmlSelect

<textarea> HtmlTextArea

<img> HtmlImage

<a> HtmlAnchor

<table> HtmlTable

<tr> HtmlTableRow

<td> HtmlTableCell

All other tags HtmlGenericControl




• The System.Web.UI.WebControls Namespace



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



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


• Cookies– Class that related to cookies: HttpCookie,

HttpCookieCollection, HttpResponse and HttpRequest





• 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

Current Popular IT I Pertemuan 3 Matakuliah: T0403/Current Popular IT I Tahun: 2008.

Documents

Transcript of Current Popular IT I Pertemuan 3 Matakuliah: T0403/Current Popular IT I Tahun: 2008.