wml programming. what is wml wml programming wireless mark up language based on xml. purpose: to...

WML Programming

WML Programming

What is WML

WML Programming

Wireless mark up language based on XML.

Purpose:

to specify user interface behavior and

display contents on wireless devices such as (phones), pagers, (PDAs)

WAP, WML --------------------------> WWW, HTML

What is WML

WML Programming

WML designed to support range of devices which have following characterstics

Small display size (relative to conventional personal computers)

Limited memory and CPU size

Low bandwidth

WAP is an application communication protocol

WAP is used to access services and information

WML Coding

WML Programming

WML Based on a Deck of Cards the device only shows 1 card at a timeCards in a Deck can Interact with other Cards in Deck and Cards in External Decks

Deck

card 1

WML Coding

WML Programming

All WML pages must have a specific header. The Deck is delimited by the <wml> . . . </wml> tag

<?xml version="1.0"?>

<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"

"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>

</wml>

WML Coding- Showing Text on Screen

WML Programming

Cards are delimited by <card id=“”> </card> tag




<wml>

<card id=“one”>

Hello World !

</card>

</wml>

WML Programming




<wml>

<card id="no1" title="Card 1"> <p>Hello World!</p></card>

<card id="no2" title="Card 2"> <p>Welcome to WAP School!</p></card></wml>

Hello World !

Only one card is displayed at a time

Result

WML Coding- Showing Text on Screen

WML Programming



WML Coding- Comments

Comments not displayed in browser.

WML Programming

WML Coding- Text Formatting

<em>emphasized</em><br/>

<strong>strong</strong><br/>

<b>bold</b><br/>

<i>italic</i><br/>

<u>underline</u><br/>

<big>big</big><br/>

<small>small</small>

normalemphasizedstrongbolditalicunderlinebigsmall

WML Programming

WML Coding- Anchors

Anchor tag used to redirect to another card.

Syntax: <a href=“target”> link-name </a>

If target is another card then use # with card name.

If target is another wml page then specify that file without #.

Syntax: <anchor> <go href=“target”> </anchor>

WML Programming

WML Coding- Anchors

Anchor tag used to redirect to another card.

Syntax: <a href=“target”> link-name </a>

<wml>

<card id="main" title=“Link Example">

<p>

<a href="#anotherCard">

My First link

</a>

</p>

</card>

</wml>

WML Programming

Anchor execution

<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">

<wml><card> <p>Some links:<br/><anchor>

<go href="d1.wml"/>News</a><br/><anchor>

<go href="d2.wml"/>Sports</a> </p></card></wml> Execution

WML Programming

WML Input

WML Programming

WML Input

Input Fields

Select & Option

FieldSet

WML Programming

Input Fields


<wml> <card title="Input"> <p> Name: <input name="Name" size="15"/><br/>Age: <input name="Age" size="15” format="*N"/><br/> Sex: <input name="Sex" size="15"/> </p> </card> </wml>

----- Input ----------

Name: Age : Sex :

Syntax: text <input name="variable" title="label" type="type"value="value" default="default" format="specifier"emptyok="boolean" size="n" maxlength="n" tabindex="n"/>

Only Numbers can be entered. * represent unlimited digit.

WML Programming

A: Any symbolic or uppercase alphabetic character (no numbers) a: Any symbolic or lowercase alphabetic character (no numbers) N: Any numeric character (no symbols or alphabetic characters) X: Any symbolic, numeric, or uppercase alphabetic character (not changeable to lowercase) x: Any symbolic, numeric, or lowercase alphabetic character (not changeable to uppercase) M: Any symbolic, numeric, or uppercase alphabetic character (changeable to lowercase)--for multiple character input, defaults to uppercase first character

m: Any symbolic, numeric, or lowercase alphabetic character (changeable to uppercase)--for multiple character input, defaults to lowercase first character

•To limit the number of characters users can enter, you can specify a single digit number before the character tag--for example, format="3X" lets user enter a maximum of three symbolic, numeric, or uppercase alphabetic characters. •To let users enter an unlimited number of characters, specify an asterisk (*) before the character tag--for example, format="*a" lets the user enter any number of symbolic or lowercase alphabetic characters.

Input Fields

WML Programming

Select & Option


<wml> <card title="Selectable List 1"> <p> <select multiple=“true”> <option value="htm">HTML School</option> <option value="xml">XML School</option> <option value="wap">WAP School</option> </select> </p> </card> </wml>

--- Selectable List 1---

HTML School XML School WAP School

WML Programming

Select

Syntax:<select title="label"

multiple="boolean” name="variable”default="default"

iname="index_var”

ivalue="default”

tabindex="n">

WML Programming

<option title="label" value="value" onpick="url">content </option>

Option Syntax

WML Programming

WML Programming

FieldSet

<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml> <card title="Selectable List 1"> <p>

<fieldset title="CD Info">

Title: <input name="title" type="text"/><br/>

Prize: <input name="prize" type="text"/>

</fieldset> </p> </card> </wml>

------- Fieldset--------

CD Info

Title:

Prize:

WML Programming

WML Tasks

WML Programming

WML tasks

Go task

Pre task

Refresh task

noop task

WML Programming

go task

The <go> element is a task element that instructs the device to open a specified URL.

If the URL specifies a particular card, the device displays that card.

If the URL specifies a deck, the device displays the first card in that deck.

WML Programming

Prev task

The <prev> element is a task element that instructs the device to remove the current URL from the history stack and open the previous URL.

If no previous URL exists on the history stack, specifying <prev> has no effect.

Syntax:

<prev>content</prev>

where content represents the variables to set when opening the previous URL:

content You can optionally specify one or more variables in a <prev> statement: <setvar>

WML Programming

<prev> tag

Prev tag used to return to previously visited card.

<anchor>Return: <prev/></anchor>

WML Programming

Noop task

The <noop> element is a task element that instructs the device to do nothing, i.e. "no operation."

This element is useful for overriding deck-level <do> elements, called shadowing

<wml> <card> <p> <do type="prev" label="Back"> <noop/> </do> </p> </card> </wml>

The <do> tag can be used to activate a task when the user clicks on a word/phrase on the screen.

When the user clicks on the "Back" link, he or she should be taken back to the previous card. But the <noop> tag prevents this operation; when the user clicks on the "Back" link nothing will happen

WML Programming

Refresh task

•The <refresh> element is a task element that instructs the device to refresh the specified card variables.

•The device also refreshes the display if any of those variables are currently shown.

Syntax

<refresh>content</refresh>

where content represents the variables to refresh:

content You must specify at least one variable in a <refresh> statement:

<var>

WML Programming

Refresh task

WML Programming

WML Variable

WML Programming

Variables

Variables consist of a letter or underscore character, followed by zero or more letters, numbers or underscore.

WML variables are case sensitive.

A WML variable can be specified in various ways:

with a setvar command

through an input element

with a postfield command

The major use of variables is for forms

WML Programming

Variables-setvar tag

<setvar name="i" value="500"/>

Syntax:

<setvar name="name" value="value"/>

When someone executes a task (like go, prev, and refresh), the setvar element can be used to set a variable with a specified value.

WML Programming

Variables-Using input field

Variables can also be set through an input element (like input, select, option, etc.).

The following example will create a variable named schoolname:

<card id="card1"><select name="schoolname"><option value="HTML">HTML School</option><option value="XML">XML School</option></select></card>

To use the variable we created in the example above:

<card id="card2"><p>You selected: $(schoolname)</p></card>

WML Programming

Form Example

<do type="accept" label="Next">

<go method="post” href="http://mydomain.com/mycgiscript.cgi">

<postfield name="searchvalue" value="$(search)"/>

<postfield name="type" value="general"/>

</go>

</do>

<p>

Search for:

<input type="text" name="search"/>

</p>

WML Programming

wml programming. what is wml wml programming wireless mark up language based on xml. purpose: to...

Documents