Web Dialog not firing a JavaScript function...

ArchToBe · 23 Jul 2011, 23:25

Greetings to all,

I'm just starting to experiment with web dialogs, and it's not going very well. At this point, I'm simply trying to run a very simple JavaScript function from Ruby. Below are two very simple scripts - one Ruby and one html/JavaScript. All I'm trying to do is get Ruby to launch a JavaScript function which fills a textbox. However, although the browser successfully loads the html file, it appears the JavaScript function is not being fired. I get no error messages, however.

Can you see what I'm doing wrong here?

THANKS!

-------- My Ruby Script... --------------------


# An experiment to fill an html dropdown list from a ruby script.

wd=UI;;WebDialog.new
path=Sketchup.find_support_file "JavaScriptTest1.htm", "plugins"
wd.set_file path
wd.show

wd.execute_script("fillTextBox();") #does NOT work!

-------- My html/JavaScript file ---------------


<html>
	<head>
		<script type="text/javascript">

			function btnButton_onclick()
				{
				    document.form1.txtBox.value = "You clicked !!!";
				}

			function fillTextBox()
				{
				    alert("Entering fillTextBox()");
    				document.form1.txtBox.value = "Hello from Ruby !!!";
                }

		</script>
	</head>
	<body>
	    <form name="form1">
    		<br />
	    	Output; <input type="text" name="txtBox" size="15">
		    <br>
		    <br>
		    <input type="button" name="btnButton" value="Go!" onclick="btnButton_onclick()">
		</form>
	</body>
</html>

ArchToBe · 23 Jul 2011, 23:27

Sorry, I forgot to mention what I'm using...

Sketchup 7.1.6860
IE 7

Jim · 24 Jul 2011, 00:45

Looks good - but maybe try to defer the execute_script by a short time just to see if it is a timing problem - calling the function before dialog has a chance to completely load.


UI.start_timer(1, false) { wd.execute_script("fillTextBox();") }

Mr.K.1 · 24 Jul 2011, 06:20

It's true, during the time webdialog loads all commands to it will be ignored, but timers are not the best system to avoid it because you never know how long it will take on someones machine.

So a much cleaner way that I only recently found out about:

wd=UI;;WebDialog.new

wd.show{
 wd.execute_script("fillTextBox();")
}

All commands inside the "show" block it will be run right after the webdialog shows, so there will be no loss of time.

Dan Rathbun · 24 Jul 2011, 10:06

The block for the show (and show_modal,) methods seem to only work on PC with MSIE. Last I knew, Safari on Mac, ignored the block for these methods.

An alternative, is to do it on the JS side with an onload event, attached to the document or body. There are several topics here that discussed this, and I recall ThomThom and TIG testing this issue on both platforms.

EDIT(Add links):

thomthom · 24 Jul 2011, 12:42

I prefer to not use the onload event, but instead use the event that triggers when the HTML DOM is ready. onloads wait until all the images and resources as loaded, but the DOM load triggers earlier. When using local files there might not be much of a noticeable difference, but in some cases you might get a visual glitch or lag before onload triggers.

ArchToBe · 24 Jul 2011, 17:39

Yes! You guys were absolutely right - it was the need for a delay which was causing the problem. As always, you guys are THE BEST!!!

Thomas, I notice you're located in Norway. We here in the US (and elsewhere I'm sure) are saddened by what has happened in Oslo. Please know that our thoughts are with you. Take care.

Jim · 24 Jul 2011, 18:04

@thomthom said:

I prefer to not use the onload event, but instead use the event that triggers when the HTML DOM is ready. onloads wait until all the images and resources as loaded, but the DOM load triggers earlier. When using local files there might not be much of a noticeable difference, but in some cases you might get a visual glitch or lag before onload triggers.

So Thomas, might this be an opportunity to get started on the Ruby API Bugtracker ?

Dan Rathbun · 24 Jul 2011, 18:36

@thomthom said:

I prefer to not use the onload event, but instead use the event that triggers when the HTML DOM is ready.

What was that event again? onReadyStateChange or onWebpageComplete ??

thomthom · 24 Jul 2011, 23:16

@dan rathbun said:

What was that event again? onReadyStateChange or onWebpageComplete ??

dean.edwards.name

(dean.edwards.name)

@jim said:

So Thomas, might this be an opportunity to get started on the Ruby API Bugtracker?

Oh -yea. Nearly forgotten about that. Please do fill in issues and get it started. I'll remember to being using it myself when I'm back from vacation.

@archtobe said:

Thomas, I notice you're located in Norway. We here in the US (and elsewhere I'm sure) are saddened by what has happened in Oslo. Please know that our thoughts are with you. Take care.

Appreciate it. I'm currently on vacation in Gøteborg and learned about it a little bit later that day when people started texting me asking if I was ok. Myself and my friends are all ok - as far as I'm aware. Still shocked about the coldbloodedness of this madman.

Dan Rathbun · 25 Jul 2011, 11:07

@thomthom said:

@dan rathbun said:

What was that event again? onReadyStateChange or onWebpageComplete ??

found it:
[onReadyStateChange event (MSIE 7+)](http://msdn.microsoft.com/en-us/library/ms536957(v)

... which uses the [readyState property](http://msdn.microsoft.com/en-us/library/ms534359(v)
You can test for values "complete" (everything is loaded,) or "interactive" (if the document is ready for user interaction.)

thomthom · 25 Jul 2011, 16:41

It's the DOMContentLoaded event I linked to...

Dan Rathbun · 25 Jul 2011, 17:54

@thomthom said:

It's the DOMContentLoaded event I linked to...

which doesn't work for MSIE (IE 9+ does have some domContent... Timing properties but the page must set to IE9 Standards mode.)

Did you see that author's addendum page? (It uses onReadyStateChange event for MSIE to avoid the separate script file.)
http://dean.edwards.name/weblog/2006/06/again/

thomthom · 25 Jul 2011, 18:07

Yes, one has to use a combo. If you look at the jQuery source you see the various methods they use to make it cross platform compatible. onReadyStateChange is used as a fallback for older IE versions. Mozilla, Opera, Webkit and newer IE use DOMContentLoaded.
http://ie.microsoft.com/testdrive/HTML5/DOMContentLoaded/Default.html