ASP.NET, Architecture, Web Forms, MVC, Web API Telerik Software Academy ASP.NET Web Forms.
Module 4: Creating a Microsoft ASP.NET Web Form. Overview Creating Web Forms Using Server Controls.
21
Module 4: Creating a Microsoft ASP.NET Web Form
-
Upload
blake-wheeler -
Category
Documents
-
view
228 -
download
0
Transcript of Module 4: Creating a Microsoft ASP.NET Web Form. Overview Creating Web Forms Using Server Controls.
Module 4:Creating a Microsoft ASP.NET Web Form
Overview
Creating Web Forms Using Server Controls
Lesson: Creating Web Forms
What is a Web Form? Creating a Web Form with Visual
Studio .NET
What Is a Web Form?
Def: Consists of a combination of HTML, code, and controls that execute on a Web server that is running IIS. Web forms display a UI by generating HTML that is sent to the browser, while the supporting code and ctrls that run the UI stay on the Web server.
.aspx extension (works as containers for the text and ctrls that you want to display on the browser)It comprised of two separate files:
.aspx (UI of the Web Form) .aspx.cs or .aspx.vb (“code-behind page” consists of supporting
code)
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server"><title>Untitled Page</title></head>
<body>
<form id="form1" runat="server"> <div> </div> </form>
</body>
</html>
What Is a Web Form? Cont.
Page attributes
Body attributes
Form attributes
What Is a Web Form? The functions of Web form are defined by three levels of
attributes:
1. Page attributes (define global functions or page specific attributes that are used by the ASP.Net page parser and compiler.
Example : Language, AutoEventWireUp, Codebehind
2. Body attributes (define how a page will be displayed on the client’s browser. Example: style
What Is a Web Form? Cont. Form attributes: defines how groups of ctrls will be processed.
Only one server side form on an .aspx.page.
Attributes of forms:Method: identifies the method of sending ctrl values back to the server. The option are: Post – data is passed in name/value pairs within the body the HTTP request. Get – Data is passed in query stringRunat: A key feature of a web form is that the controls run on the server.runat=“server” attributes causes the form to post control information back to the ASP.Net page on the server where the supporting code runs.If runat not set to server, the form will work as a regular HTML form.
Creating a Web Form with Visual Studio .NET
New ASP.NET Web Applications create a default Web Form: Default1.aspx
Create additional Web Forms from the Solution Explorer
Upgrade existing HTML pages into Web Forms
Lesson: Using Server Controls What is a Server Control? Types of Server Controls Saving View State HTML Server Controls Web Server Controls Selecting the Appropriate Control
What is a Server Control?
Def : ASP.Net server controls are components that run on the server and encapsulate UI and other related functionality. Server contrlos are used in ASP.Net pages and ASP.Net code behind classes. Server controls include buttons, text boxes and drop down lists.
Runat="server" means run on the server not on user’s browser.• Events happen on the server• View state saved
<asp:Button id="Button1" runat="server" Text="Submit"/><asp:Button id="Button1" runat="server" Text="Submit"/>
What is a Server Control? Cont.
Have built-in functionalityThe functionality of a control is what happens when the user clicks a button or a list box. These processes are called event procedures.
Common object model• All have Id and Text attributes• Eg: Background color for all controls used the same
property: Backcolor property.
Create browser-specific HTMLWhen a page is rendered for a browser, the Web server controls determine which browser is requesting the page and then delivers the appropriate HTML
Types of Server Controls HTML server controls HTML elements with attributes that make them visible to
and programmable on the server.
Web server controls• Intrinsic controls
Eg: button, list box, text box
• Validation controls- incorporate logic that allows you to test a user’s
input.- Attach a validation control to the input control and
specify the conditions of correct user input.- Eg: RequiredFieldValidator, ValidationSummary,
RangeValidator
Types of Server Controls ( Cont.)
• Rich controls – a complex control that include multiple functions - Eg: AdRotator, Calendar ( displays a sequence of
advertisement )
• List-bound controls – can be used to display lists of data on an
ASP.NET web page- to display reformat, sort and edit data- Eg: DataGrid, DataList, DropDownList,
RadioButtonList
Saving View State
Webforms are stateless. It does not retain any information on prior request.
ViewState is a hidden control that helps to solve the problem of webpage. It will store / records the state of the controls ( setting and user inputs ) on a web page as the HTML travels back and forth between the client and server.
Hidden ViewState control of name-value pairs stored in the Web Form
On by default, adjustable at Web Form and control level
<%@ Page EnableViewState="False" %>
<asp:ListBox id="ListName" EnableViewState="true" runat="server">
</asp:ListBox>
<%@ Page EnableViewState="False" %>
<asp:ListBox id="ListName" EnableViewState="true" runat="server">
</asp:ListBox>
<input type="hidden" name="__VIEWSTATE" value="dDwtMTA4MzE0MjEwNTs7Pg==" />
<input type="hidden" name="__VIEWSTATE" value="dDwtMTA4MzE0MjEwNTs7Pg==" />
HTML Server Controls
Based on HTML elements Exist within the
System.Web.UI.HtmlControls namespace
<input type="text" id="txtName" runat="server" />
<input type="text" id="txtName" runat="server" />
Exist within the System.Web.UI.WebControls namespace
Control syntax
HTML that is generated by the control
Web Server Controls
<asp:TextBox id="TextBox1"runat="server">Text_to_Display</asp:TextBox>
<asp:TextBox id="TextBox1"runat="server">Text_to_Display</asp:TextBox>
<input name="TextBox1" type="text" value="Text_to_Display"Id="TextBox1"/>
<input name="TextBox1" type="text" value="Text_to_Display"Id="TextBox1"/>
You need specific functionality such as a calendar or ad rotator
The control will interact with client and server script
You are writing a page that might be used by a variety of browsers
You are working with existing HTML pages and want to quickly add ASP.NET Web page functionality
You prefer a Visual Basic-like programming model
You prefer an HTML-like object model
Use Web Server Controls if:Use Web Server Controls if:Use HTML Server Controls if:Use HTML Server Controls if:
Bandwidth is not a problemBandwidth is limited
Selecting the Appropriate Control
Exercise If you were given a Web page with an. aspx
extension, what would you look for to verify that it is a Web Form?
If you were given a Web page with an. aspx extension, what would you look for to see if there are Web server controls?
What type of code or script does a Web server control generate on the client?
Review
Creating Web Forms Using Server Controls
~ End of Slides ~
