Webmaster''''s Guide to the Wireless Internet part 41 ppt
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (244.61 KB, 10 trang )
372 Chapter 9 • Microsoft Mobile Internet Toolkit
When we click on the Submit button, we print a message on the same page,
as shown in Figure 9.3.
Notice that the name in the textbox is gone and the item in the selection list
has been reset to the first item. Figure 9.4 shows the ASP code for our sample
Web application.
www.syngress.com
Figure 9.1 MobileQuickStart Page
Figure 9.2 Web Application Using ASP
159_wg_wi_09 10/22/01 5:29 PM Page 372
Microsoft Mobile Internet Toolkit • Chapter 9 373
Figure 9.4 Eg1.asp
<html>
<b>Tell us about yourself:</b>
<form method="post" action="eg1.asp">
Name<input type="text" name="userName"> <br/>
Which part of the world are you from?
<select name="partOfWorld">
<option value="Europe">Europe
<option value="Asia">Asia
<option value="United States of America">United States of America
</select>
<input type="submit" value="submit">
<%
if Request.Form("userName")<>""then
Response.Write "<i>Welcome to ASP.NET, " &
Request.Form("userName") & " (from
" & Request.Form("partOfWorld") & ")!</i>"
end if
%>
</html>
To ensure that the name and selection item remains selected after submission,
we must modify our codes as shown in Figure 9.5.
www.syngress.com
Figure 9.3 State Is Lost When the ASP Page Is Submitted
159_wg_wi_09 10/22/01 5:29 PM Page 373
374 Chapter 9 • Microsoft Mobile Internet Toolkit
Figure 9.5 Eg2.asp
<html>
<b>Tell us about yourself:</b>
<form method="post" action="eg2.asp">
Name<input type="text" name="userName" value="<%
=Request.Form("userName") %>"> <br/>
Which part of the world are you from?
<% itemSelected=Request.Form("partOfWorld") %>
<select name="partOfWorld">
<option <%if itemSelected="Europe" then Response.write "SELECTED"
end if %>
value="Europe">Europe
<option <%if itemSelected="Asia" then Response.write "SELECTED"
end if %> value="Asia">Asia
<option <%if itemSelected="United States of America" then
Response.write "SELECTED" end if
%> value="United States of America">United States of America
</select>
<input type="submit" value="submit">
<%
if Request.Form("userName")<>""then
Response.Write "<i>Welcome to ASP.NET, " &
Request.Form("userName") & " (from " &
Request.Form("partOfWorld") & ")!</i>"
end if
%>
</html>
And now our Web application will behave as we intend it to, as shown in
Figure 9.6.
www.syngress.com
159_wg_wi_09 10/22/01 5:29 PM Page 374
Microsoft Mobile Internet Toolkit • Chapter 9 375
From this simple example, you can see clearly the following problems with
the current ASP technology:
■
Mixture of HTML and scripting codes Our code in Figure 9.4
contains a mixture of display codes (HTML) and application logic (using
VBScript). Because building Web applications often involves graphic
designers and programmers, the current ASP technology does not pro-
vide a clean separation of display from content.This often results in bugs
and difficulties in post-project maintenance.
■
Extra effort must be spent on maintaining states In Figure 9.5,
look at the amount of code you have to write in order for the server to
maintain the state when transiting from page to page. Most of the time
spent on maintaining states could be directed toward implementing busi-
ness logic.
Now let’s look at how we can do the same thing using ASP.NET—look at
the code shown in Figure 9.7.
NOTE
ASP.NET pages ends with a .aspx extension.
Figure 9.7 Eg1.aspx
<script language="vb" runat="server">
Sub Button1_clicked (sender as Object, e as EventArgs)
www.syngress.com
Figure 9.6 Preserving State in ASP Requires Substantial Effort
Continued
159_wg_wi_09 10/22/01 5:29 PM Page 375
376 Chapter 9 • Microsoft Mobile Internet Toolkit
message.text = "<i>Welcome to ASP.NET, " & userName.Text &
"(from " & partOfWorld.Value & ") !</i>"
End Sub
</script>
<html>
<body>
<form runat="server">
<b>Tell us about yourself : </b><br/>
Name : <asp:textbox runat="server" id="userName"/><br/>
Which part of the world are you from?
<select id="partOfWorld" runat="server">
<option value="Europe"/>
<option value="Asia"/>
<option value="United States of America"/>
</select>
<asp:button runat="server" id="button1" onClick="Button1_clicked"
text="Submit"/>
</form>
<asp:label runat="server" id="message"/>
</body>
</html>
The ASP.NET code shown in Figure 9.7 deserves our closer attention.We
can divide this code into two main parts, content and code. In the figure, the part
related to code rather than content is depicted in in boldface.
The Content Components
Within the user interface (UI) part of Figure 9.7, we can see familiar HTML
code. In addition, we also see a few new tags starting with an asp: prefix. You
might also notice some of the elements have the additional runat attribute. Let’s
define some terms used in ASP.NET.The whole ASP.NET document shown in
our example is known as a Web Form. A Web Form contains two components:
Code and Content.The Content component of a Web Form can contain Web
Form Server controls.Web Form Server controls contain the following types of
www.syngress.com
Figure 9.7 Continued
159_wg_wi_09 10/22/01 5:29 PM Page 376
Microsoft Mobile Internet Toolkit • Chapter 9 377
controls: HTML Server control, ASP.NET Server control, Validation controls, and User
controls.The examples in the next section illustrate the first two kinds of controls.
(We’ll examine the validation controls later in the chapter. User controls are
much more complex and won’t be addressed here.)
HTML Server Controls
An example of an HTML Server control is as follows:
<select id="partOfWorld" runat="server">
Notice that HTML Server controls are similar to the normal HTML elements,
except that they have the additional runat attribute. In ASP.NET, normal HTML
elements are converted to HTML Server controls so that they can be programmed
on the server.The id attribute acts as a unique identifier for the server controls.
NOTE
If you have experience programming Visual Basic, a good way to view
ASP.NET programming is to imagine yourself writing VB codes, except
that this time your application runs on the Web platform. You can
imagine an ASP.NET page as an executable file, producing HTML codes to
be sent to the Web browser.
ASP.NET Server Controls
Besides the HTML server controls,ASP.NET provides a different set of server
controls known as ASP.NET server controls.You can think of ASP.NET server
controls as ActiveX controls in VB. Unlike the HTML Server controls, they do
not provide a one-to-one mapping.The following is an example of an ASP.NET
Server control:
<asp:button runat="server" id="button1" onClick="Button1_clicked"
text="Submit"/>
This ASP.NET server control will render itself as an <input> element when
viewed using a Web browser. ASP.NET server controls expose properties and
events that you can set and service. For example, this ASP.NET server control
defines the onClick event.When the button is clicked, the Button1_clicked subrou-
tine would be serviced (which is covered in the next section).
www.syngress.com
159_wg_wi_09 10/22/01 5:29 PM Page 377
378 Chapter 9 • Microsoft Mobile Internet Toolkit
NOTE
If you are experienced with HTML, think of ASP .NET server controls as
another set of tags and elements that you can use to create dynamic Web
applications. For example, instead of using the <input> tag for text input,
you can also use the <asp:input> element (but with more features!).
The Code Components
The Content component basically concerns itself with display issues.The Code
components are the “glue” that binds things up. Our example shows a subroutine
defined in the Code section.This subroutine is fired when the user clicks on the
Submit button. It then displays a welcome message by referencing the controls
defined in the Content section.
<script language="vb" runat="server">
Sub Button1_clicked (sender as Object, e as EventArgs)
message.text = "<i>Welcome to ASP.NET, " & userName.Text &
"(from " & partOfWorld.Value & ") !</i>"
End Sub
</script>
NOTE
Again, the processing model of ASP.NET should be very familiar to VB
programmers.
Figure 9.8 shows what our ASP.NET page looks like on the Web browser.
After a page has been submitted, it will retain its state before the submission.
To see the HTML codes generated by the ASP.NET runtime, select View
Source (see Figure 9.9).
www.syngress.com
159_wg_wi_09 10/22/01 5:29 PM Page 378
Microsoft Mobile Internet Toolkit • Chapter 9 379
Figure 9.9 Our Example’s HTML Output
<html>
<body>
<form name="ctrl1" method="post" action="eg1.aspx" id="ctrl1">
<input type="hidden" name="__VIEWSTATE"
value="YTB6OTY0MzM4NTkzX2Ewel9oejV6M3hfYTB6YTB6aHpUZVx4dF88aT5XZWxjb21lI
HRvIEFTUC5ORVQsIFdlaSBNZW5nIExlZShmcm9tIEFzaWEpICE8L2k+eF9feF9feHhfeF9fe
A==f77c15df" />
<b>Tell us about yourself : </b><br/>
Name : <input name="userName" type="text" value="Wei Meng Lee"
id="userName" /><br/>
Which part of the world are you from?
<select name="partOfWorld" id="partOfWorld">
<option value="Europe">Europe</option>
<option selected value="Asia">Asia</option>
<option value="United States of America">United States of
America</option>
</select>
<input type="submit" name="button1" value="Submit" id="button1" />
</form>
www.syngress.com
Figure 9.8 ASP.NET Preserves the State Automatically
Continued
159_wg_wi_09 10/22/01 5:29 PM Page 379
380 Chapter 9 • Microsoft Mobile Internet Toolkit
<span id="message"><i>Welcome to ASP.NET, Wei Meng Lee(from Asia)
!</i></span>
</body>
</html>
What is interesting in this HTML output is the hidden input element, indi-
cated in Figure 9.9 in boldface.
The __VIEWSTATE hidden element is the one that performs all the magic. It
is responsible for “maintaining” states between pages.The value of this hidden ele-
ment is used by the ASP.NET runtime to recall the previous state the page was in.
NOTE
The concept of using a hidden element to maintain state is somewhat
similar to that of using a browser session, with a sessionid passed as a
hidden form value, or of using a cookie.
ASP.NET Architecture
Figure 9.10 illustrates the architecture of ASP.NET.The Web client first interacts
with Internet Information Server (IIS). If the Web client is accessing HTML
pages, IIS will communicate with the underlying operating system to fetch the
HTML pages. If the Web client is accessing an ASP.NET application, the
ASP.NET application will first be compiled to produce a .NET runtime class.
The .NET runtime class is then compiled and invoked to produce HTML to be
sent to the client side.
One important difference between ASP.NET and ASP is that ASP.NET appli-
cations are parsed and compiled once and then cached, so that subsequent
requests do not go through the same time-consuming steps.This creates a positive
impact on the performance of ASP.NET applications.
www.syngress.com
Figure 9.9 Continued
159_wg_wi_09 10/22/01 5:29 PM Page 380
Microsoft Mobile Internet Toolkit • Chapter 9 381
Developing Mobile Web Forms
Now that you have seen how ASP.NET works, it is time to take a look at a very
simple Mobile Web Form and the components it contains (Figure 9.11).
Figure 9.11 Welcome.aspx
<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage"
Language="VB" %>
<%@ Register TagPrefix="Mobile" Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>
<Mobile:Form id="FormOne" runat="server">
<Mobile:Label runat="server">Welcome to the Microsoft Mobile
Internet Toolkit!</Mobile:Label>
</Mobile:Form>
Figure 9.12 shows the code from Figure 9.11 displayed in different kinds of
browsers: Pocket PC, UP.SDK 4.1, and IE 5.5.
If you have been developing WAP application using WML and ASP, you
would be surprised that the same application can be displayed on all these dif-
ferent devices, with no effort on your side for customization.That’s the power of
the Microsoft Mobile Internet Toolkit SDK.
www.syngress.com
Figure 9.10 Architecture of ASP.NET
Web Clients
Internet Information Server (IIS)
ASP.NET
Application
.NET
Framework
Windows NT/2000 OS
159_wg_wi_09 10/22/01 5:29 PM Page 381
