Scalable and flexible approach HTML page with Javascript and applet.

Enterprise Java
Architecting and Designing Scalable, Multitier Systems
by Michael Minh Nguyen
Listing 4. Scalable and flexible approach HTML page with Javascript and applet.


<!-- To demo the front-end tier only, search for "document.regForm.submit" and comment

  out that line and uncomment the alert statement following it. -->

<HTML><HEAD><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">

<TITLE>User Registration</TITLE></HEAD>

<script LANGUAGE="JavaScript">

function registerUser ()

{

  var errorMsg;

  if ((errorMsg = document.UserApplet.setFirstName(document.regForm.firstName.value)) != '')

  {

    alert (errorMsg);

    return false;

  }

  if ((errorMsg = document.UserApplet.setMiddleInitial (document.regForm.middleInitial.value)) != '')

  {

    alert (errorMsg);

    return false;

  }

  if ((errorMsg = document.UserApplet.setLastName (document.regForm.lastName.value)) != '')

  {

    alert (errorMsg);

    return false;

  }

  if ((errorMsg = document.UserApplet.setEmail (document.regForm.email.value)) != '')

  {

    alert (errorMsg);

    return false;

  }

  // to demo the front-end tier only, comment out "document.regForm.submit" and

  // uncomment the alert statement following it.

  document.regForm.submit ();

  // alert ('User Register Successful.  In real application, a confirmation page will be

  // displayed instead');

}

</script>

<BODY>

<!-- In actual application, you would package the applets and associated beans into

   one single jar file. -->

<APPLET CODEBASE = "./" CODE="com.scalablemultitier.UserApplet.class"

  NAME="UserApplet" WIDTH=0 HEIGHT=0 HSPACE=0 VSPACE=0 ALIGN=top></APPLET>

<H1>Scalable Multi-tier System Using Javascript, applets, and beans.</H1>

<h2>This is a demo page that demonstrate the deployment of regular beans in the browser by

wrapping them with applets.  The beans are then used via Javascript and applets to enforce

domain-layer business rules to provide the users with immediate response for invalid data

and at the same time make the system more scalable by minimizing the traffic of sending

invalid data to the server.  Becase these beans are regualr Java classes, they can also

be used in other front-end tiers such as JFC clients or in the middle-tier as well.</h2>

<h2>View the HTML source code to see how simple the Javascript code is. Note that the user

error message such as 'First Name needs to be between 1 and 10 characters' are not in

the Javascript but obtain from the beans thru the applet.</h2>

<form name="regForm" method="POST" action="/servlet/registerUserScalableApproach">

  <p>First Name (* 1-10 characters)   

  <input type="text" name="firstName" size="20"></p>

  <p>Middle Initial  (0-1 character)  

  <input type="text" name="middleInitial" size="1"></p>

  <p>Last Name  (* 1-10 characters)  

  <input type="text" name="lastName" size="20"></p>

  <p>Email (*)            

  <input type="text" name="email" size="20"></p>

  <p><input type="button" value="Submit" name="button" onClick="registerUser()">

  <input type="reset" value="Reset" name="B2"></p><p>* - Indicates required fields</p>

</form></BODY></HTML>

About the Author

Michael Minh Nguyen is a senior software engineer at eBuilt Inc. in Irvine, CA. He may be contacted at [email protected].

Most   Popular