Scripting a Data Access Page: a Simple Example - Adding a script to this page

(Page 3 of 4 )

We will add script to change the heading 'Test' to something different. We will change this heading to something that will depend on one of the columns in the database.  Review the next picture; it shows the result of a query which returns the values used in the DAP (this page).  There are various cities, including 'London.'  We will change the heading's text depending on the 'City' that is in view.

What will the script accomplish?

We will be creating a script to change the Label to 'Welcome to Heathrow' if the city is 'London,' or 'Welcome to World' for any other city at the click of a button. Instead of the click event of the button you may as well use any other multitude of events the DHTML allows.

Now in the design view add a CommandButton as shown here. Change its Element Properties, innerText from Command1 (default) to 'London?' as shown.

Now open up the Microsoft Script editor to see the document outline as shown. You can see the Command1 object in the Client Objects and Events folder.

On an empty area of the page, right click to bring up the Document Property Pages as shown and change the default scripting language so that the client's default language is JavaScript (ECMAScript) as shown here. The default is VbScript.

In an empty area of the page right click, and from the drop-down menu choose Insert Script Block -->Client as shown.  Please refresh your memory about the various windows in the script editor.

This will allow you to write JavaScript/ECMA for the client. Now double click the Command1 button's click event in the Document window shown earlier. This adds the script shown in this picture.

Now to the function of the command1 click add the following code.  

function Command1_onclick() {
alert("Will be formatting");
alert(document.getElementById("HeadingText").outerHTML);
var hd=document.getElementById("HeadingText");
hd.style.color="magenta";
hd.innerHTML="<h2>Welcome</h2>"
//variable hd refers to the document's heading var 

cty=document.getElementById("City_Label");
//similarly cty refers to the City_Label[different from City] 

cty.style.backgroundColor="lime";
var ctytxt=document.getElementById("City");
alert(ctytxt.innerHTML);
//
if(ctytxt.innerHTML=="London")
{ 
hd.innerHTML="Welcome to Heathrow";
}
else{
hd.innerHTML="Hello world!";
}
//
var cn=document.getElementById("CompanyName_Label");
var con=document.getElementById("ContactName_Label");
cn.style.backgroundColor="lime";
con.style.backgroundColor="lime";
} 

Next: Saving and Displaying the Data Access Page >>
 

More Microsoft Access Articles
More By Jayaram Krishnaswamy

Comments On: Scripting a Data Access Page: a Simple Example

· Using the built-in wizards you can do a lot, but with scripting you can do even...   >>> Post your comment now!