Javascript usage

Developers Programming
#1

Hey all, I’m trying to use some javascript on form and control app in a project I’m doing. I have it defined in php as follows:

//<?php
$text = “Testing”;
function dialog_pop($text){}
?>
<html lang=“en”>
<head>
<meta charset=“utf-8”>
<title>jQuery UI Dialog - Basic modal</title>
<link rel=“stylesheet” href=“themes/base/jquery.ui.all.css”>
<script src=“jquery-1.4.2.js”></script>
<script src=“external/jquery.bgiframe-2.1.1.js”></script>
<script src=“ui/jquery.ui.core.js”></script>
<script src=“ui/jquery.ui.widget.js”></script>
<script src=“ui/jquery.ui.mouse.js”></script>
<script src=“ui/jquery.ui.draggable.js”></script>
<script src=“ui/jquery.ui.position.js”></script>
<script src=“ui/jquery.ui.resizable.js”></script>
<script src=“ui/jquery.ui.dialog.js”></script>
<link rel=“stylesheet” href=“demos/demos.css”>

<script>
$(function() {
$( “#dialog-modal” ).dialog({
height: 140,
modal: true
});
});
</script>
</head>
</html>
<?php
echo ‘<div id=“dialog-modal” title=“Dialog Box Test”>’.$text.’</div>’;
?>

I created a php method on my form with the above code (which works fine if I run the page in a browser) and then define a button for testing on the form to call the function to test it. But it doesnt work. When I call the form all I get is a blank screen, nothing else. Not even an error. Am I missing something here? Has anyone else used jquery from within SC that has a code example of how you got it to work? TIA all.

Kevin

#2

Re: Javascript usage

Did you try opening the console error of firefox? to check if there is any javascript error?
Look and the apache log to see if there is any php error, such as fatal error(when you get blank screen).

Other thing … scriptcase alreay includes JQuery js’s … did this path is visible to the application: <script src=“ui/jquery.ui.core.js”></script>?
Try to put the full path …

#3

Re: Javascript usage

Thanks Diogo. Can you tell me the directory paths SC uses for jquery and any other javascript libraries that are used, and the versions? If they are older, is it safe to upgrade them from a normal distribution? Also, what about adding 3d party libs, such as ExtJS? Where should I put them so they can be called from within an SC app? Are these libs visible globally in all SC created apps? If so, then should my code I posted work if I use the inbuilt SC jquery lib? Thanks!

Kevin

#4

Re: Javascript usage

jquery is in prod/third/jquery if im not wrong :stuck_out_tongue:

You can call any 3d party js … as long as you fill the path to the js files.

Once you use this <script src=“ui/jquery.ui.core.js”></script> inside a scriptcase app, this mean the that inside the application must exists a path called “ui” with the js “jquery.ui.core.js” inside.

AS long as scriptcase creates the application in scriptcase/app/PROJECT/APP … you’ll need to put the librari inside the application.
Instead of this, you can put the jquery or other 3d party js libraries in a directory called “js” in your wwwroot directory.
And inside this directory you put the jquery in js/ui/…
This mean that the url to access this js is:
<script src="/js/ui/jquery.ui.core.js">

Do you understand the difference?
Your script worked as a external file cause you problably have a directory called “ui” …

#5

Re: Javascript usage

Thanks Diogo, I’ll see if I can get it working. You are correct, the php file I created actually resides in the same directory I have the jquery files in so the relative paths are correct. I’ll see if I can get the files copied to the proper paths under SC and get it working.

Kevin

#6

Re: Javascript usage

Diogo,
I’m getting closer but still have some problems. I moved the lib files to wwwroot/js like you suggested. That fixed the white page problem in a form app. However I still have a problem. For testing I created a button on the form and for the code I am using this:

//<?php
function growl_pop(){}
?>
<head>
<link rel=“stylesheet” href="/js/jquery.jgrowl.css" type=“text/css”/>
<script type=“text/javascript” src="/js/jquery-1.4.2.js"></script>
<script type=“text/javascript” src="/js/jquery.jgrowl.js"></script>
<script type=“text/javascript” src="/js/jquery.ui.all.js"></script>
<script type=“text/javascript”>

	(function($){
	
		$(document).ready(function(){
			$.jGrowl.defaults.closer = false;

			if ( !$.browser.safari ) {
				$.jGrowl.defaults.animateOpen = {
					width: 'show'
				};
				$.jGrowl.defaults.animateClose = {
					width: 'hide'
				};
			}
			$.jGrowl.defaults.position = 'center';		
			$.jGrowl.defaults.life = 10000;	
			$test = "This is a test";			
			$.jGrowl($test, {header: 'Attention!'});
						
		}); 
		
	})(jQuery);

	&lt;/script&gt;

</head>

When I click the button on the form the dialog DOES pop up and works fine! That’s good. However, it always shows this on the browser screen at the top no matter what:

$_SESSION[‘scriptcase’][‘gmrs_control’][‘contr_erro’] = ‘off’; ?> (gmrs_control is the control app i have the button on)

And also has an “OK” button right below that. What is causing this and how can I get rid of it?

Now, the other problem is that even though this works in a button on the form, if I place the same code in a php method and try to call the function from the button (instead of putting the code in the button itself) it does NOT work and gives me the blank screen again and the form itself never even loads. Any ideas? What I am trying to do is make it so I can call the above code as a php function like I have it created as and be able to call that function from within an event, such as onScriptInit or onLoad. The library I’m using allows for a timed dialog that goes away after x number of seconds and I want it to display this while the form is loading (it pulls data from a web site so it takes some time) How can I accomplish this? Thanks.

Kevin

#7

Re: Javascript usage

blank screen is when your php is having some errors and the php give up …

post to complete code you are using in the button and you’ll try monday on my scriptcase. and will see if there is an easy way to do that …

#8

Re: Javascript usage

Ok thanks Diogo.

Kevin

#9

Re: Javascript usage

Diogo,

This is the exact code I’m using in the button on my form app:

$text = “This is an animated dialog test.”;
?>
<meta charset=“utf-8”>
<title>jQuery UI Dialog - Animation</title>
<link rel=“stylesheet” href="/js/themes/blitzer/jquery-ui-1.8.5.custom.css">
<script src="/js/jquery-1.4.2.js"></script>
<script src="/js/ui/jquery-ui-1.8.5.custom.js"></script>
<script>

$.fx.speeds._default = 800;

$(function() {
	$( "#dialog" ).dialog({
		autoOpen: true,
		show: "slide",
		hide: "slide",
		draggable: false,
		resizable: false,
		modal: true
	});
});
&lt;/script&gt;

When I click the button the dialog DOES pop up and works fine, except I get the below text in the top of the browser:

$_SESSION[‘scriptcase’][‘form_contacts’][‘contr_erro’] = ‘off’; ?>

With an “OK” button directly below the text. The other problem is, even though this code works on a button I can’t get it to function in any events, or if I create a php method with the above code and try to call it as a function. I just get a blank screen when I put the code in either of those areas and the form never even shows. Thanks.

Kevin

$_SESSION[‘scriptcase’][‘form_contacts’][‘contr_erro’] = ‘off’; ?>

#10

Re: Javascript usage

Look if is this that you want:

http://www.scriptcase.net/forum_en_us/index.php?topic=2003.msg6349#msg6349

#11

Re: Javascript usage

Diogo,
Thanks for the info. While this does work it is only helpful in some situations. The problem I am having is this. I am using a control app to query a web site for information. I want this dialog to show WHILE the form is in the background loading. I can set it to timeout after a certain period of time if needed. But doing it the way you describe, since it’s done in a FIELD, the dialog doesn’t actually show until AFTER the web site has returned the data and the form actually loads. Do you know how I can accomplish creating the dialog as a waiting message that shows WHILE the form is loading in the background? Thanks!

Kevin

#12

Re: Javascript usage

JavaScript is a lot of frequently acclimated as a client side scripting language. This agency that JavaScript cipher is accounting into an HTML page. When a user requests an HTML page with JavaScript in it, the Software is beatific to the browser and it’s up to the browser to do something with it.