|
| Re: Loading a List Box |
 |
Wed, 06 Feb 2008 06:37:18 -080 |
Claus Mygind wrote:
> Below are three apps.
> 1) a dBase app "testLoadThis.prg"
> 2) an HTML app "testLoadThis.html"
> 3) a javaScript. "testLoadThis.js"
>
> I am puzzled by this behavior, why it works from the html app but not from
> the dBase app.
>
> The purpose of the app is to let the user select from list box 1 and put
the
> value into list box 2. When the user clicks on one of the listed choices
in
> list box1, the onClick event handler calls the "addSelect(elm)"
function in
> the linked javaScript file.
What I have found is that once the web page is generated from the dBL
app, take a look at the Page Source in the browser. Review what is
streamed out. The odds are something is missing, or not quote the way
you want it ...
Ken
--
/(Opinions expressed are purely my own, not those of dataBased
Intelligence, Inc.)/
*Ken Mayer* [dBVIPS]
/Golden Stag Productions/
dBASE at goldenstag dot net
http://www.goldenstag.net/GSP
http://www.goldenstag.net/dbase/dBASEBooks.htm
|
| Post Reply
|
| Loading a List Box |
 |
Wed, 6 Feb 2008 08:25:15 -0600 |
Below are three apps.
1) a dBase app "testLoadThis.prg"
2) an HTML app "testLoadThis.html"
3) a javaScript. "testLoadThis.js"
I am puzzled by this behavior, why it works from the html app but not from
the dBase app.
The purpose of the app is to let the user select from list box 1 and put the
value into list box 2. When the user clicks on one of the listed choices in
list box1, the onClick event handler calls the "addSelect(elm)"
function in
the linked javaScript file.
From the HTML app the function works fine, but using the same code from the
dBase app, the value is "undefined".
I was able to create a workaround, which will work with both. In the
workaround I pass the parameter "this" which is read as incomming
parameter
"elm". When I read the "elm.value" it works fine. The line
has been
commented out in the javaScript file and you can simply comment out the line
above it and uncomment the workaround line.
I am using EditPlus v 2.11 as my html and javaScript text editor and running
dBase 2.6.0.0 b1899 with BDE 5.2.0.2
To minimize broken lines I have moved everything to the left which still
works fine. However the lines in the javaScript file may wrap, so I have
included a blank line between each. if a line is wrapped please unwrap it
before testing.
//The dBase App
/* testLoadThis
Author: Claus Mygind
Date: 2/6/08
Purpose:
This simply test the loading of one list box from another
*/
_app.errorAction = 3
Set talk OFF // turn off interactive mode
Set century ON // Y2K
Try // Error trap entire CGI applet.
// Create new instance of the Web Class
set procedure to WebClass.cc additive
oCGI = new MyCGISession()
// Connect to the Web Server (StdIn/StdOut)
oCGI.Connect()
oCGI.streamHeader()
oCGI.StreamBody()
oCGI.streamFooter()
catch (exception e)
oCGI.errorPage(e)
endtry
oCGI = null // Clean up
////// all done
Quit
Class MyCGISession of CGISession from "WebClass.cc"
function StreamHeader
with (this.fOut)
puts([Content-type: text/html])
puts('')
puts([<HTML>])
puts('')
puts([<HEAD>])
puts([<TITLE>Test Load</TITLE>])
puts('')
//make sure the next line is not wrapped
puts([<script type="text/javascript"
language="JavaScript"
src="testLoadThis.js"></script>])
puts([</HEAD>])
endwith
function streamBody
with (this.fOut)
puts([<BODY])
puts([>])
puts([<FORM])
puts([ name="f1"])
puts([>])
puts([<TABLE>])
puts([<TR>])
puts([<TD>])
puts([Add fields])
puts([</TD>])
puts([<TD>])
puts([Delete fields])
puts([</TD>])
puts([</TR>])
puts([<TR>])
puts([<TD>])
puts([<SELECT])
puts([ NAME="getThisField"])
puts([ id="getThisField"])
puts([ onChange="addSelect(this);"])
puts([ size="4"])
puts([>])
puts([<option])
puts([ selected value="">])
puts([</option>])
puts([<option])
puts([ value="orange">])
puts([ Orange</option>])
puts([<option])
puts([ value="apple">])
puts([ Apple</option>])
puts([<option])
puts([ value="pear">])
puts([ Pear])
puts([</option>])
puts([</SELECT>])
puts([</TD>])
puts([<TD>])
puts([<SELECT])
puts([ NAME="removeThisField"])
puts([ id="removeThisField"])
puts([ onChange="removeSelect(this);"])
puts([ size="4">])
puts([ <option value="">Default Fields</option>])
puts([</SELECT>])
puts([</TD>])
puts([</TR>])
puts([</TABLE>])
puts([</FORM>])
puts([</BODY>])
puts([</HTML>])
endwith
return true
endClass
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//The HTML app
<Content-type: text/html>
<HTML>
<HEAD>
<TITLE>Test Load</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<script type="text/javascript" language="JavaScript"
src="testLoadThis.js"></script>
</HEAD>
<BODY>
<FORM
name="f1"
id="f1"
>
<SELECT
NAME="getThisField"
id="getThisField"
onChange="addSelect(this);"
size="4"
>
<option
value="">
</option>
<option
selected value="orange">
Orange
</option>
<option
value="apple">
Apple
</option>
<option
value="pear">
Pear
</option>
</SELECT>
<SELECT
NAME="removeThisField"
id="removeThisField"
onChange="removeSelect(this);"
size="4"
>
<option
selected value="*">
Default Values
</option>
</SELECT>
</FORM>
</BODY>
</HTML>
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//The javaScript File
/*
Watch for line breaks,
There is a blank line between each line in this scripts.
If any line is shown as wrapped delete the return before running.
*/
var myFieldList = new Array();
function addSelect(elm)
{
/*
This is the line that does not work in the dBase app but does work in the
HTML app
*/
var chk = document.getElementById("getThisField").options.value
/*
this is the workaround line
*/
// var chk = elm.value
alert( chk ) ;
myFieldList[myFieldList.length] = chk;
document.getElementById("removeThisField").options.length = 0;
for (var i = 0; i < myFieldList.length; i++ )
{
document.getElementById("removeThisField")[i]= new Option(
myFieldList[i],
myFieldList[i], false, true);
}
}
function removeSelect(elm)
{
var chk = document.getElementById("removeThisField").selectedIndex;
myFieldList.splice(chk,1);
document.getElementById("removeThisField").options.length = 0;
for (var i = 0; i < myFieldList.length; i++ )
{
document.getElementById("removeThisField")[i]= new Option(
myFieldList[i],
myFieldList[i], false, true);
}
}
|
| Post Reply
|
| Re: Loading a List Box |
 |
Wed, 6 Feb 2008 08:42:02 -0600 |
I had forgotten to put in one last bit of information. I am using FireFox
2.0.0.11. Funny thing I had tested the HTML app from EditPlus where it
worked fine. When I opened the file in the browser that is when the problem
occured. So now I suspect the problem is not with dBase, or the BDE but
with the browser. And indeed I have confirmed that it works in IE v7
This is very ironic as FireFox is suppose to comply with the WC3 standard.
And they always throw back a caution if you do not use.
document.getElementById("") format.
So mystery solved.
|
| Post Reply
|
| Re: Loading a List Box |
 |
Wed, 6 Feb 2008 11:46:47 -0600 |
For those trying to keep score here is the real reason why my original line
did not work.
/*Incorrect statement which did work in IE7 but not in FireFox*/
var chk = document.getElementById("getThisField").options.value
/*Correctly formatted statement which works in both IE7 and FireFox and I
suspect all other WC3 compliant browsers. Notice I forgot the reference to
the selected item in the original line that is why I got an
"undefined"
result returned. */
var chk =
document.getElementById("getThisField").options[document.getElementByI
d("getThisField").options.selectedIndex].value
//optional workaround method.
var chk = elm.value
|
| Post Reply
|
|
|
|
|
|
|
|
|
|