We have seen in previous articles how to develop Mobile Web Forms using the Microsoft Mobile Internet Toolkit. We can make use of the Mobile Web Forms controls to add controls which will be rendered on the client side and also have a server side object representation. The controls provide a big spectrum of UI functionality on varied target devices and expose properties methods and events in the server side object model.
However, in simple cases, we may need to just add some plain text and basic markup to the Mobile Web Form - content which does not require any server side manipulations. In this case, we can directly add the literal text to the Mobile Web Form. The Mobile Web forms support a very limited number of literal markup tags directly specified on the web form, namely, <a>, <b>, <br>, <i> and <p> . The tags specified in the literal text may get converted to another format and if the literal text between two controls contains only white space, it will be ignored. To introduce a break between two controls using literal text, use " " in addition to the white space.
The Mobile Internet Controls Runtime generates a LiteralText control to represent the literal text in the control tree. You must keep this in mind when you are accessing controls programmatically.
Let's take a look at a simple example of using literal text within a Mobile Form.
Figure: Sample - Using literal text within Mobile Web Forms.
Complete Code Listing
MobileWebForm1.aspx
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile, Version=1.0.3300.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" %>
<%@ Page language="VB" Codebehind="MobileWebForm1.aspx.vb" Inherits="mobweb01.MobileWebForm1" AutoEventWireup="false" %>
<meta name="GENERATOR" content="Microsoft Visual Studio 7.0">
<meta name="CODE_LANGUAGE" content="VB">
<meta name="vs_targetSchema" content=http://schemas.microsoft.com/Mobile/Page>
<body Xmlns:mobile="http://schemas.microsoft.com/Mobile/WebForm">
<mobile:Form id="Form1" runat="server">
<B>Literal Text Example for Mobile Web
Forms</B> <br />
<p>This example shows how to add literal text within mobile forms. Go to <A href="www.microsoft.com/mobile/pocketpc/default.asp">Microsoft Pocket Pc Web
Site</A>. </p> <p>
<I>Next read the instructions carefully.</I>
</p>Please Enter your Name:
<mobile:TextBox id="Name" runat="server"></mobile:TextBox>
</mobile:Form>
</body>
NOTE: This article is purely for demonstration. This article should not be construed as a best practices white paper. This article is entirely original, unless specified. Any resemblance to other material is an un-intentional coincidence and should not be misconstrued as malicious, slanderous, or any anything else hereof.
Conclusion:
We have seen in this article how to add text and basic html markup elements directly to Mobile Web Forms with simple requirements. You can mix the use of literal text and Mobile Web controls to provide a convenient interface for your mobile web sites.