22. Clearing a Saved Form in WML

As you may notice, after you have inputted some data in a form, the form data is saved. The data you inputted in the form remains there no matter you refresh or navigate backwards/forwards to the WML card.

As mentioned earlier, each input field or selection list created is associated with a variable. The data entered in the input field or the value of the option chosen in a selection list is stored in the variable. For example, if you include the line <input name="myName"/> in a card, the characters entered into the input field will be stored in the variable myName.

WML variables have a global scope. Once a value is assigned to a variable, it will remain there even if you navigate to another card. When an earlier form is displayed again, the WAP browser will take the values saved in the variables and use them as the initial values of the input fields or selection lists. For example, if you include the line <input name="myName"/> in a card, the value assigned to the myName variable earlier will be used to initialize the input field.

Hence, to clear a saved form, you have to write some markup code to clear the variables associated with the input fields and selection lists of the form.

The following WML examples demonstrate several ways to clear a saved form. Below is the markup code of the first example. What we want to do is to ensure our form is in the default state every time it is displayed.

(clearSavedFormEg1.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 Saved Forms">
    <onevent type="onenterforward">
      <refresh>
        <setvar name="myName" value=""/>
        <setvar name="myGender" value=""/>
        <setvar name="favorite_tutorial_part" value=""/>
      </refresh>
    </onevent>
    <onevent type="onenterbackward">
      <refresh>
        <setvar name="myName" value=""/>
        <setvar name="myGender" value=""/>
        <setvar name="favorite_tutorial_part" value=""/>
      </refresh>
    </onevent>

    <p>
      Hello, welcome to our WML tutorial.<br/>

      What's your name?<br/>
      <input name="myName"/><br/>

      Are you a boy or a girl?<br/>
      <select name="myGender">
        <option value="Boy">I am a boy</option>
        <option value="Girl">I am a girl</option>
      </select><br/>

      Which part of our WML tutorial do you like?<br/>
      <select name="favorite_tutorial_part" multiple="true">
        <option value="Part 1">Part 1</option>
        <option value="Part 2">Part 2</option>
        <option value="Part 3">Part 3</option>
        <option value="Part 4">Part 4</option>
      </select><br/><br/>

      <anchor>
        <go method="get" href="clearSavedFormEg1Proc.asp">
          <postfield name="name" value="$(myName)"/>
          <postfield name="gender" value="$(myGender)"/>
          <postfield name="tutorial_part" value="$(favorite_tutorial_part)"/>
        </go>
        Submit Data
      </anchor>
    </p>
  </card>
</wml>

Here is the ASP file that handles the form data submitted to the server. It simply prints out the name-value pairs received.

(clearSavedFormEg1Proc.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" %>

<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("tutorial_part") %><br/>
    </p>
  </card>
</wml>

In the above WML example, the WAP browser clears the variables myName, myGender and favorite_tutorial_part when the onenterforward event or the onenterbackward event occurs. We make use of both the onenterforward and onenterbackward events so that no matter if a user reaches the card in the forward or backward direction, the form variables will be reset to an empty string.

The drawback of the above method is that if the user does not go back to the original card, the saved form is not cleared. In some situations such as when the form data is confidential, it is better to clear the saved form as soon as possible. In our second WML example, we clear the saved form in the submission result card. The markup is shown below:

(clearSavedFormEg2.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 Saved Forms">
    <p>
      Hello, welcome to our WML tutorial.<br/>

      What's your name?<br/>
      <input name="myName"/><br/>

      Are you a boy or a girl?<br/>
      <select name="myGender">
        <option value="Boy">I am a boy</option>
        <option value="Girl">I am a girl</option>
      </select><br/>

      Which part of our WML tutorial do you like?<br/>
      <select name="favorite_tutorial_part" multiple="true">
        <option value="Part 1">Part 1</option>
        <option value="Part 2">Part 2</option>
        <option value="Part 3">Part 3</option>
        <option value="Part 4">Part 4</option>
      </select><br/><br/>

      <anchor>
        <go method="get" href="clearSavedFormEg2Proc.asp">
          <postfield name="name" value="$(myName)"/>
          <postfield name="gender" value="$(myGender)"/>
          <postfield name="tutorial_part" value="$(favorite_tutorial_part)"/>
        </go>
        Submit Data
      </anchor>
    </p>
  </card>
</wml>

(clearSavedFormEg2Proc.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" %>

<wml>
  <card id="card1" title="Submission Result">
    <onevent type="onenterforward">
      <refresh>
        <setvar name="myName" value=""/>
        <setvar name="myGender" value=""/>
        <setvar name="favorite_tutorial_part" value=""/>
      </refresh>
    </onevent>

    <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("tutorial_part") %><br/>
    </p>
  </card>
</wml>

In the above WML example, the onenterforward event is triggered when the card in the ASP file is loaded. The event action is to clear the variables myName, myGender and favorite_tutorial_part.

An alternative is to use the newcontext attribute of the <card> tag. If the newcontext attribute value is set to true, the WAP browser will be reset to the initial state. All WML variables (and the navigational history) will be cleared as a result.

(clearSavedFormEg3Proc.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" %>

<wml>
  <card id="card1" title="Submission Result" newcontext="true">
    <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("tutorial_part") %><br/>
    </p>
  </card>
</wml>

The drawback of clearing a saved form in the submission result card is that we do not know which card a user will browse next. If a user types some data in the form but does not select the submit anchor link (for example, he/she may press the Back button of the mobile phone or may enter the URL of another WAP site), the submission result card will not be reached and so the saved form will remain in the memory.

Page 49 of 50

Print this Web Page | | Back to Top

Feedback Form (Expand Collapse)