Program (in-)actions with different browsers.

@JMRKERMar 05.2006

I am in the process of writing an programmable RPN calculator in javascript.
You can view the abbreviated version at: ~~[URL=http://www.nova.edu/~rumsey/JS/CalcTest.html]~~www.nova.edu/~rumsey/JS/CalcTest.html[/URL]

The more extensive version has the same problem, both act differently with different browsers. For example:

? With NS-7 and FF:
Entering numbers from keyboard into the upper left text box works OK until you use the “Enter/Return” key on the keyboard. The value disappears from the textbox, the stack is either cleared or drops the top value and SOMETIMES an error is reported in the ‘javascript:’ console.

? With IE-6:
Entering numbers from keyboard into the upper left text box works OK until you use the “Enter/Return” key on the keyboard. Then nothing happens. No errors, no actions, nothing.

? For both versions of the problems above, I can continue by clicking on the “Enter” button, or any other button and all works as expected

All the button actions work correctly for both browsers:
You can verify this by using only the buttons for calculations or click on “Test Setup” to fill the stack box followed by the following sequence:
Click gives Results on top of stack
+ gives 70.00
– gives -50.00
x gives -500.00
/ (divide) gives 0.40

You can select the ‘inverse’ option from the select list:
value inverse gives 2.50

I get no errors when I use the buttons of the form, but different errors with the “Return/Enter” key on the keyboard. To make matters worse, I get very little in the way of information as to what it is doing when it is not doing anything.

The more extensive version of the program is located at: ~~[URL]~~http://www.nova.edu/~rumsey/JS/CalcList.html[/URL]
but it has the same problems as the abbreviated version when entries from the keyboard are followed by the “return/enter” key of the keyboard.

Can anyone explain what is happening here and how I correct it?
I hate to give up on this project when it is so close to being finished.
I have some other ideas that I want to add to the program, but until I can get past the problem stated above I don’t want to further add to MY confusion.
?

to post a comment

JavaScript

17 Comments(s) _↴

@phpnoviceMar 05.2006 — # ? With NS-7 and FF:

Entering numbers from keyboard into the upper left text box works OK until you use the "Enter/Return" key on the keyboard. The value disappears from the textbox, the stack is either cleared or drops the top value and SOMETIMES an error is reported in the 'javascript:' console.[/QUOTE]
Sometimes, pressing the ENTER key in a form field submits the associated form object -- thus clearing the form fields as the page is submitted to itself. Place the following in your FORM tag:

onsubmit="return false"

@JMRKERauthorMar 05.2006 — #Thanks phpnovice, but I did this ... twice!

See original source:

[CODE]
 <!--
 .....
 
 function NoOp (tform) { return false; }   // No Operation activity for onSubmit
 
 .....
 -->
 </script>
 </head>
 <body>
 <form name="my_form" onSubmit="NoOp(this.form); return false">
 
 [/CODE]

I may not need both, but neither one seems to work.

Any other ideas?

@phpnoviceMar 05.2006 — #[b]this.form[/b] is erroneous in the FORM tag anyway. That only applies at the form element level -- not to the form itself. At any rate... I tried your page in FF and am getting the following error when pressing the [Enter] key:

Error: [Exception... "'Permission denied to get property XULElement.selectedIndex' when calling method: [nsIAutoCompletePopup::selectedIndex]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "JS frame :: http://www.nova.edu/~rumsey/JS/CalcTest.html :: ClrXreg :: line 28" data: no]

Source File: http://www.nova.edu/~rumsey/JS/CalcTest.html

Line: 28

Which is this line:

function ClrXreg (tform) { tform.Xreg.value = ""; }

Which references this INPUT element:

<input type="text" name="Xreg" value="" size=30)">

I see a syntax error there.

@phpnoviceMar 05.2006 — #:confused: With IE-6:
Entering numbers from keyboard into the upper left text box works OK until you use the "Enter/Return" key on the keyboard. Then nothing happens. No errors, no actions, nothing.[/QUOTE]

This is to be expected. If you are not trapping for the use of the [Enter] key in this particular text box, then the [Enter] key is not supposed to do anything.

@JMRKERauthorMar 05.2006 — #Man, what good eyes you have phpnovice!

The syntax typo error was only in the abbreviated version.

I fixed that and now I get no errors reported, but the actions in NS and FF are the same. To see this, click on the "Test Setup" then move to the top left input field and type 123 followed by a "Return/Enter" on the keyboard.

What is supposed to happen is the same as if I had clicked on the "Enter" button just to the right of the input field.

What happens in NS is that I lose the entry AND the top item on the "stack" just below the input field. I lose two values for the price of one keyboard entry!

In IE, nothing happens at all. No errors, no adding to the top of the "stack". I want it to do the same as if I had clicked on the "Enter" button.

this.form is erroneous in the FORM tag anyway. That only applies at the form element level -- not to the form itself. At any rate... [/QUOTE]
I am not sure I understand your comment about the "this.form". How do I pass the parameters of the FORM if I don't tell the function where to find the data?

And finally, how does the "Enter" button onClick function work differently from the keyboard "Return/Enter" actions? I am trying to call the same function with either keyboard entry or button clicks. I guess I don't know what to change regarding your comment: This is to be expected. If you are not trapping for the use of the [Enter] key in this particular text box, then the [Enter] key is not supposed to do anything.[/QUOTE]

Thanks for looking into my program phpnovice. The program seems to work as I want it except for the pesky keyboard "Return/Enter" actions.

@phpnoviceMar 05.2006 — #I am not sure I understand your comment about the "this.form". How do I pass the parameters of the FORM if I don't tell the function where to find the data?[/QUOTE]
At the FORM level, use just [b]this[/b] to pass an object reference for the FORM.

At the form elements level, use [b]this.form[/b] to pass an object reference for the FORM.

@phpnoviceMar 05.2006 — #... how does the "Enter" button onClick function work differently from the keyboard "Return/Enter" actions? I am trying to call the same function with either keyboard entry or button clicks.[/QUOTE]
The following is an example of trapping for the [Enter] key -- for example, so that you can programmatically click your own ENTER button:

[code=html]
 <input type="text" ...etc... onkeydown="
 var key = (window.Event) ? event.which : event.keyCode;
 if (key == 13) { // [Enter] key pressed?
 this.form.myEnterButton.click();
 return false;
 }
 return true;">
 [/code]

@JMRKERauthorMar 05.2006 — #You are much faster at analyzing the problem than I am.

I just tried changing all the "this.form" entries within the body of the program to "this" only. Nothing happened. Clicking on any of the buttons caused no actions to occur.

At the FORM level, use just this to pass an object reference for the FORM.

At the form elements level, use this.form to pass an object reference for the FORM.[/QUOTE]

So I put the "this" back to "this.form" and all works a expected again.

I'll look at your posting about the "enter" key next

Thanks for your time phpnovice.

@phpnoviceMar 05.2006 — #I just tried changing all the "this.form" entries within the body of the program to "this" only. [/QUOTE]
[I][B]I did not say to change them [U]all[/U]![/I][/B] :rolleyes: Change only the one in the FORM tag (form level) -- not the ones on your INPUT, SELECT, and TEXTAREA elements (form element level)!

@JMRKERauthorMar 05.2006 — #Thanks phpnovice, you have solved 1/2 of my "Enter" problem with your last posting. The program now works with the "Return/Enter" keyboard entry just like it does with the "Enter" button ... but only if I am using IE

The problem continues the same as before with NS or FF browsers. When I press the keyboard "Return/Enter" ke ... the typed entry disappears as well as the previous entries on the 'stack'.

Do you have another trick up you sleeve? ?

Still no errors in the 'javascript:' console in NS or FF. (?)

The latest version of the abbreviated test program remains at: [URL]http://www.nova.edu/~rumsey/JS/CalcTest.html[/URL]

and I have put comments around the earlier "<INPUT...>" versions

My desire remains that the program does not act differently with different browsers, but maybe I'm dreaming that I can create a universally coded program using the javascript language.

@JMRKERauthorMar 05.2006 — #phpnovice

Quote:

Originally Posted by JMRKER

I just tried changing all the "this.form" entries within the body of the program to "this" only.

I did not say to change them all! Change only the one in the FORM tag (form level) -- not the ones on your INPUT, SELECT, and TEXTAREA elements (form element level)!

OK, I told you I did not understand and I was correct! :rolleyes:

I made the change, but as you suspected it made no difference to the end result.

@phpnoviceMar 05.2006 — #I also see no DOCTYPE in your page. Mozilla browsers don't like this.

I'm still seeing the following two errors in FF when the [Enter] key is pressed:

Error: [Exception... "'Permission denied to get property XULElement.selectedIndex' when calling method: [nsIAutoCompletePopup::selectedIndex]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "JS frame :: http://www.nova.edu/~rumsey/JS/CalcTest.html :: ClrXreg :: line 28" data: no]

Source File: http://www.nova.edu/~rumsey/JS/CalcTest.html

Line: 28

Error: [Exception... "'Permission denied to get property XULElement.selectedIndex' when calling method: [nsIAutoCompletePopup::selectedIndex]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "JS frame :: <unknown filename> :: onkeydown :: line 2" data: no]

Source File:

Line: 2

Otherwise, this part of the code I gave you may be IE-only:

this.form.EnterBtn.click();

So, try substituting that with one line with this:

Enter(this.form,'');

@JMRKERauthorMar 06.2006 — #Sorry to be away for awhile, had to do some weekend chores.

Per phpnovice recommendation:
I also see no DOCTYPE in your page. Mozilla browsers don't like this.[/QUOTE]
I have never intentionally used a DOCTYPE before for any javascript code I have created, but since this program is driving me nuts, I put one in. I searched the forum and found the following:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

which I placed before the HTML in the code. Does not seem to have made any difference, but I'll leave it in until I have a reason to modify it or take it out.

Should the DOCTYPE be placed at a specific location with the HTML code to be interpreted correctly? ?

Then, per:

Otherwise, this part of the code I gave you may be IE-only:

this.form.EnterBtn.click();

So, try substituting that with one line with this:

Enter(this.form,'');[/QUOTE]
I did the substitution and this also does not seem to change any of the results. IE still works OK and NS does not work yet when the "RETURN/ENTER" key is pressed on the keyboard.

The only slight difference I can see now is that the upper left textbox entry seems to get written (very very quickly) to the 'stack', but then it is immediately wiped out along with any other value that may be on the top of the 'stack'

I'll try to research the FF error reported. I do not get the errors with NS-7 or IE-6. Does this mean that I now need to check three different browsers for compatibility when writing javascript code? Seems strange for some simple code in a standardized and stable language to act differently in so many different browsers.

I'll get back about any progress I find.

@phpnoviceMar 06.2006 — #Should the DOCTYPE be placed at a specific location with the HTML code to be interpreted correctly? ?[/QUOTE]
It must be the very first line in your document -- before the opening HTML tag. Its presence removes any doubt, for the browser, as to your design intentions. ?

@phpnoviceMar 06.2006 — #Well, I cannot get FF to admit that it recognizes the content of the [b]onkeydown[/b] event. So, split the JavaScript out of this:

[code=html]
  <input type="text" name="Xreg" value="" size="30"
 onkeydown="var key = (window.Event) ? event.which : event.keyCode;
 if (key == 13) { // [Enter] key pressed?
 Enter(this.form,'');
 return false;
 } return true;">
 [/code]

and make it more like this:

[code=html]
 <input type="text" name="Xreg" value="" size="30"
 onkeydown="return acceptEnterKey(event)">
 
 <script type="text/javascript">
 function acceptEnterKey(e) {
 var key = (e.which) ? e.which : e.keyCode;
 if (key == 13) {                    // if [Enter] key pressed
 Enter(this.form, "");           // execute button code
 return false;                   // ignore [Enter] key in text box
 }                                   // else
 return true;                        // continue normally
 }
 </script>
 [/code]

@JMRKERauthorMar 06.2006 — #If I've forgotten to thank you phpnovice, please know I appreciate all your efforts and guidance thus far.

Here is the latest progress:

1. I tried your last suggested change with the HTML code.

Results: It did not work as well as your first suggestion.

In other words, the

[code=html] 

 <input type="text" name="Xreg" value="" size="30"
 onkeydown="var key = (window.Event) ? event.which : event.keyCode;
 if (key == 13) { // [Enter] key pressed?
 Enter(this.form,'');
 return false;
 } return true;">
 [/code]

worked better than the version that called the function.

Just to make sure I did it right, the function was supposed to follow the input statement as shown and was not to be put into the <HEAD> section, right?

2. I did a search of keypresses on the the forum.

I inserted the following code within the <HEAD> section

[code=html]
  function kH(e) {
 var pK = e ? e.which : window.event.keyCode;
 return pK != 13;
 }
 document.onkeypress = kH;
 if (document.layers) document.captureEvents(Event.KEYPRESS);
 
 [/code]

I found code above at: http://www.felgall.com/jstip43.htm

It caused all keypress of ENTER on keyboard to be ignored

Only problem is that it works TOO GOOD and cancels ENTER key input EVERYWHERE, but with phpnovice code in (1.) above it causes the enter key to be recognized the same way in both NS-7 and IE-6. I still need to check out the FF browser, but so far so good.

There may come a time when I need to recognize the "RETURN/ENTER" key within a <TEXTAREA>, but for now I can do without it. I'll cross that creek when I come to it.

I'll let you know if I have more problems with the FF browser, but I expect not since the NS-7 version is now working as expected.

I don't know why the things are working at this time, but I'm not getting errors and the results are acting as expected for the NS and IE browsers.

?

@phpnoviceMar 06.2006 — #Just to make sure I did it right, the function was supposed to follow the input statement as shown and was not to be put into the <HEAD> section, right?[/QUOTE]
It certainly could have been moved to the HEAD section.

As for why the second change did not work as well as the first... The only thing I really changed from the code I normally use, is testing against [B]e.which[/B] instead of [B]window.Event[/B] -- perhaps I should have left that part as-is. ?

Also in #JavaScript _↴

Jump menu control 2 javascript apps on one page issues Pls Help Me

Success!

Help @JMRKER spread the word by sharing this article on Twitter...

Tweet This

Program (in-)actions with different browsers.

17 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Program (in-)actions with different browsers.

17 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

17 Comments(s) _↴

Also in #JavaScript _↴