Wireless Markup Language Dr.

Qadri Hamarsheh
Overview of WML

Advanced Programming Language (630501)

Fall 2011/2012 – Lecture Notes # 10

Handling Events

Outline of the Lecture

WML Events and the <onevent>

Timer and the ontimer Event

WML Events and the <onevent> Tag

• The <onevent></onevent> tags are used to create event handlers
• You can specify an action to be taken whenever an event occurs. Four events are
supported in WML.
1. ontimer -- This event occurs when a timer expires.
2. onenterbackward -- This event occurs when a user goes back to a card through the
WAP browser's URL history as a result of a <prev> task.
3. onenterforward -- This event occurs when a user goes to a card in the forward
direction as a result of <go> task.
4. onpick -- This event occurs when an item of a selection list is selected or deselected.

Syntax:

<onevent type="event_type">
A single task to be done whenever the event occurs
</onevent>

Example 10.1 : Clearing a Saved Form in WML

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"
"http://www.wapforum.org/DTD/wml13.dtd">
<wml>
<card id="card1" title="Clear Forms">
<onevent type="onenterforward">
<refresh>
<setvar name="Name" value=""/>
<setvar name="Gender" value=""/>
<setvar name=" part" value=""/>
</refresh>
</onevent>
Page 1 of 5 1
Wireless Markup Language Dr.Qadri Hamarsheh
Overview of WML

<onevent type="onenterbackward">
<refresh>
<setvar name="Name" value=""/>
<setvar name="Gender" value=""/>
<setvar name=" part" value=""/>
</refresh>
</onevent>
<p>
Hello, welcome to our Online Course.<br/>
Enter your name?<br/>
<input name="Name"/><br/>
Are you a boy or a girl?<br/>
<select name="Gender">
<option value="Boy"> boy</option>
<option value="Girl"> girl</option>
</select><br/>
Which part of our Online Course do you like?<br/>
<select name=" part" multiple="true">
<option value="WML"> WML </option>
<option value="HTML"> HTML </option>
<option value="WAP">WAP</option>
<option value="WMLScript"> WMLScript </option>
</select><br/><br/>
<anchor>
<go method="get" href="clearProc.asp">
<postfield name="name" value="$(Name)"/>
<postfield name="gender" value="$(Gender)"/>
<postfield name="tutorial_part" value="$( part)"/>
</go>
Submit Data
</anchor>
</p></card></wml>

• The ASP file that handles the form data submitted to the server. It simply prints out
the name-value pairs received (Optional example).

Optional Example : (clearProc.asp)

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"
"http://www.wapforum.org/DTD/wml13.dtd">
<% Response.ContentType = "text/vnd.wap.wml" %>
Page 2 of 5 2
Wireless Markup Language Dr.Qadri Hamarsheh
Overview of WML

<wml>
<card id="card1" title="Submission Result">
<p>
Data received at the server:<br/>
Name: <% =Request.QueryString("name") %><br/>
Gender: <% =Request.QueryString("gender") %><br/>
Which part of our WML tutorial do you like?
<% =Request.QueryString("part") %><br/>
</p>
</card>
</wml>

Timer and the ontimer Event

• The ontimer event is used together with timers. To add a timer in WML, you need the
<timer/> tag.
• The <timer> element provides a method for invoking a task automatically after some
period of user inactivity.

Syntax

<timer name="variable" value="value"/>

• Its value attribute specifies the period of time after which the timer will expire. The time
unit is 1/10 second. For example, the following WML markup:

<timer value="10"/>

defines a timer that will expire after 1 second.

• You can add a timer to refresh the content of a card regularly so that the information on
the card can be kept updated without involving any user actions.

Example 10.2
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"
"http://www.wapforum.org/DTD/wml13.dtd">
<wml>
<card id="card1" title="Timer in WML">
<onevent type="ontimer">
<go href="ontimerEg1.wml"/>
Page 3 of 5 3
Wireless Markup Language Dr.Qadri Hamarsheh
Overview of WML

</onevent>
<timer value="50"/>
<p>
WML Timer Test
</p></card></wml>

• The above example can be written in the following short form. The ontimer attribute
of the <card> tag is used instead of the <onevent></onevent> and <go/> tags.

<card id="card1" title="Timer in WML" ontimer="ontimerEg1.wml">

<timer value="50"/>
<p>
</p>
</card>

• Note that the order of the <timer> element and the <onevent> element in the WML
document does matter.

Example 10.3
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<template>
<do type="options" label="Server">
<go href="http://localhost/Somefile.asp" method="get">
<postfield name="UserID" value="ADSF452"/>
<postfield name="Password" value="SSSSSSS"/>
<postfield name="Country" value="$Country"/>
</go>
</do>
</template>
<card id="Main" title="FAQ">
<onevent type="onenterforward">
<refresh>
<setvar name="Name" value="Ahmed"/>
<setvar name="Age" value="20"/>
</refresh>
</onevent>
<onevent type="onenterbackward">
<refresh>
Page 4 of 5 4
Wireless Markup Language Dr.Qadri Hamarsheh
Overview of WML

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

<setvar name="Age" value="30"/>
</refresh>
</onevent>
<p>
Country:
<select title="Country" name="Country" >
<option value="Jordan" onpick="#Result">Jordan </option>
<option value="Syria" onpick="#Result">Syria </option>
<option value="France" onpick="#Result">France </option>
<option value="UK" onpick="#Result">UK </option>
<option value="Germany" onpick="#Result1">Germany</option>
</select><br/>
Name = $(Name)<br/>
Age = $(Age)
</p></card>
<card id="Result" title="Result Card">
<onevent type="ontimer">
<go href="#Main"/>
</onevent>
<timer name="t1" value="40"/>
<p>Your choice is the following : <br/>
Country = $(Country)
</p></card>
<card id="Result1" title="Germany Card">
<do type="accept" label="Go Back">
<prev/>
</do>
<p>Go Back to the previous card </p></card></wml>

Page 5 of 5 5