Webmaster''''s Guide to the Wireless Internet part 19 potx

Please retry..."; WMLBrowser.go"Example3.wml"; } } function DisplayMessagemessage { Dialogs.alertmessage; return ; } Dissecting the Code Again, let’s start with the WML deck shown in Fig

Trang 1

Figure 4.7Example2.wmls—WMLScript Program to Calculate the Factorial of

a Number

extern function Calculate(num){

var result = 1;

for (var i=1; i<=num; i++) result *= i;

WMLBrowser.setVar("result", result);

WMLBrowser.go("Example2.wml#card2");

}

Dissecting the Code

In this example, we want the WMLScript (see Figure 4.7) to calculate the facto-rial of a number and display the result in a card.This example illustrates several different features of the WMLScript language

Let’s take a closer look at the WML deck (see Figure 4.6):

The user enters a number through the use of the <input> element.

The Calculate() function within the Example2.wmls file is called.The number entered by the user (num) is passed to the function.

<p>

$num ! is $(result)

</p>

</card>

Card2 will display the result of the operation performed by the WMLScript

The value of result is set by the WMLScript function.

Within the WMLScript function, we have the function declaration of

Calculate():

extern function Calculate(num){

var result = 1;

Trang 2

A new variable result is defined with the var keyword and set to a value of 1.

for (var i=1; i<=num; i++) result *= i;

The for loop repeatedly executes a set of instructions In this case, it multiplies

all the numbers from 1 to num

WMLBrowser.setVar("result", result);

The result is stored into the WML variable result using the setVar() function

from the WMLBrowser library Notice that a pair of double quotes encloses the

WML variable result.

WMLBrowser.go("Example2.wml#card2");

}

Once the result is stored, #card2 from the WML deck is loaded using the

go()function from the WMLBrowser library Figure 4.8 displays the resulting screens on the WAP Toolkit

Using WMLScript for Input Validation

The next example illustrates a very common usage of WMLScript—input valida-tion Input validation is a very common task performed by Web applications

Imagine asking the user for his or her birth date If the user enters 13 for month, the error could be detected early by client-side input validation, rather than posting the input to the server and causing a round-trip delay only to realize that the input is erroneous.This is especially important for WAP application, as the connection is inherently slow and therefore there is a necessity to reduce the number of connections to the server

Figure 4.8Performing Mathematical Operations Using WMLScript

Trang 3

In this application, we have a user registering using a WAP browser.The user keys in his or her userID and enters a password twice for confirmation.The WMLScript will compare the two passwords to ensure that they are identical before proceeding to register the user (The WML deck is shown in Figure 4.9 and the WMLScript is shown in Figure 4.10.)

Figure 4.9Example3.wml—WML Deck to Prompt Users to Enter a UserID and Password

<?xml version="1.0"?>

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

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

<wml>

<p>

UserID : <input type="text" name="userID"/>

Password: <input type="password" name="password1"/>

Confirm Password: <input type="password" name="password2"/>

</do>

</p>

</card>

</wml>

Figure 4.10Example3.wmls—WMLScript Program to Perform Input Validation

extern function verifyPassword (Password1, Password2)

{

var URL;

if (String.compare(Password1, Password2) == 0) { URL = "register.asp?userID=" + WMLBrowser.getVar("userID") +

"&password=" + Password1;

WMLBrowser.go(URL);

}

Trang 4

else { DisplayMessage("Passwords do not match! Please retry ");

WMLBrowser.go("Example3.wml");

} }

function DisplayMessage(message) { Dialogs.alert(message);

return ; }

Dissecting the Code

Again, let’s start with the WML deck shown in Figure 4.9:

UserID : <input type="text" name="userID"/>

Password: <input type="password" name="password1"/>

User enters a userID and password Confirm Password: <input type="password" name="password2"/>

The user re-enters the password:

The verifyPassword() function in Example3.wmls is called.The two

pass-words are passed to this function Notice the pair of double quotes surrounding the two input parameters

At the WMLScript end, shown in Figure 4.10, is:

extern function verifyPassword (Password1, Password2)

The first function in this file, verifyPassword(), has two input parameters:

Password1 and Password2

var URL;

if (String.compare(Password1, Password2) == 0) {

Figure 4.10Continued

Trang 5

The compare() function in the String library is used to compare the two

strings If they are identical, the function will return a value of 0 If the two pass-words were identical, an ASP file would be called

URL = "register.asp?userID=" + WMLBrowser.getVar("userID") +

"&password=" + Password1;

The URL for the ASP file is created with the query string containing the userID and password

WMLBrowser.go(URL);

The browser is then redirected to the ASP file:

else {

DisplayMessage("Passwords do not match! Please retry ");

If the two passwords are not identical, the DisplayMessage() function is

then called.This function takes in a single input parameter:

WMLBrowser.go("Example3.wml");

Once the message is displayed, we reload the Example3.wml deck:

function DisplayMessage(message) {

Dialogs.alert(message);

return ; }

Notice that the DisplayMessage() function does not have the extern

key-word.This function can be used only within the WMLScript file and is not callable from a WML deck directly.The output of Example3.wml and

Example3.wmls are shown in Figure 4.11

Figure 4.11Comparing User Inputs Using WMLScript

Trang 6

Functions that only are used internally do not require the extern keyword.

Credit Card Validation

Another common use for WMLScript is in validating credit card numbers.This example illustrates several WMLScript language constructs by checking the validity of a credit card number

The Credit Card Validating Algorithm

Depending on the credit card type, most credit card numbers are encoded with a check digit By running the credit number through some algorithms, a check digit is often appended to the end of the credit card number.To validate that the number is a valid credit card number, the numbers are applied the same algo-rithm in the reverse manner.The following illustrates the LUHN Formula (Mod 10) for validating a credit card number

1 Multiply the value of alternate digits by 2, starting from the second rightmost digit

2 Add all the individual digits derived from step 1.

3 If the sum of all the digits is divisible by 10, the card number is valid;

otherwise it is invalid

Let us demonstrate this algorithm’s use with an example In this example we will attempt to validate a credit card with the number 123467890123456

1 First, multiply the value of the alternate digits by 2 starting from the second rightmost digit as described previously

2 Next, add the individual digits derived from the previous step

2 + 2 + 6 + 4 + ( 1 + 0 ) + 6 + ( 1 + 4 ) + 8 + ( 1 + 8 ) +

0 + 2 + 2 + 6 + 4 + ( 1 + 0 ) + 6 = 64

Trang 7

3 Finally, attempt to divide the resultant sum from step 2 by a value of 10 Sum=64

Sixty-four is not divisible by 10; therefore the card number is invalid! Our implementation of this algorithm using WMLScript is shown in Figure 4.12 and Figure 4.13

Figure 4.12Example4.wml—WML Deck to Prompt the User to Enter a Credit Card Number

<?xml version="1.0"?>

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

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

<wml>

</do>

</template>

<p>

Please enter credit card number:

</do>

</p>

</card>

<p>

Credit number not correct

</p>

</card>

<p>

Credit number correct

Trang 8

</card>

</wml>

Figure 4.13Example4.wmls—WMLScript Program to Validate the Authenticity of a Credit Card Number

extern function Validate(num) { var sum = 0;

var temp, length;

length = String.length(num);

for (var i=length-1; i>=0; —i) { //start with rightmost digit

if (i % 2 == 0) { temp = Lang.parseInt(String.charAt(num,i)) * 2; //multiply the

//number by 2 sum += Lang.parseInt(String.charAt(temp,0)); //sum up the

// first digit

if (String.length(temp) > 1) //if more than 1

//digit

sum += Lang.parseInt(String.charAt(temp,1));// sum up the

// second digit } else {

sum += Lang.parseInt(String.charAt(num,i)); // simply sum up

// the number }

}

if (sum % 10 != 0) // if not divisible

// by 10 WMLBrowser.go("#card2"); // card number

// not valid else // else

Continued

Trang 9

WMLBrowser.go("#card3"); // card number

// is valid }

Dissecting the Code

We start with the <template> element of the WML deck shown in Figure 4.12:

</do>

</template>

The <template> element defines deck-level event binding In this case, the

< do> element is applicable to all the cards in the deck.

Because WMLScript does not support the use of array, we have to improvise the use of array using a string Since a string supports element indexing, we can manipulate the digits as though we are using an array (this can be seen in Figure 4.13) For example, if we have 1234567890123456, we can manipulate it as a string (see Figure 4.14)

Given the following statement:

length = String.length(num);

We will first want to know the length of the number:

for (var i=length-1; i>=0; —i) { //start with rightmost digit

We will then use a for loop to cycle through all the digits in the number:

Figure 4.14Manipulating a String Much Like an Array

Trang 10

if (i % 2 == 0) { temp = Lang.parseInt(String.charAt(num,i)) * 2; //multiply the

//number by 2

If the position is an even number (the % is the modulus operator), multiply the digit at that position by 2:

sum += Lang.parseInt(String.charAt(temp,0)); //sum up the first digit

and sum up the result digit-by-digit.

if (String.length(temp) > 1) //if more than 1

//digit

sum += Lang.parseInt(String.charAt(temp,1));// sum up the

// second digit

If the result contains more than a digit, sum up the second digit

} else { sum += Lang.parseInt(String.charAt(num,i)); //simply sum up the number }

If the position number is not an even number, simply sum up the number

if (sum % 10 != 0) //if not divisible by 10 WMLBrowser.go("#card2"); //card number not valid else //else

WMLBrowser.go("#card3"); //card number is valid

Finally, take the result and perform a modulus 10 operation If there is no remainder the card is valid; otherwise it is invalid Figure 4.15 shows the resulting screens on the WAP Toolkit

Figure 4.15Validating Credit Card Numbers Using WMLScript

Định dạng
Số trang	10
Dung lượng	174,63 KB