Shouldn't I be able to do this?

[aeroswat]

Instead of doing a function like this in the onclick of an html element

 

onclick="functionname(this);"

 

do it like this

<script type='text/javascript'>
updateForm($('#systemName'));
</script>

 

or like this

 

<script type='text/javascript'>
updateForm(document.getElementById('idofelement'));
</script>

[KevinM1]

Sure you could, if you don't require the function firing when the user does some action.

[aeroswat]

Sure you could, if you don't require the function firing when the user does some action.

 

That's what I thought but I am using it like this

 

<script type='text/javascript'>
document.getElementById('systemName').selectedIndex=0;
updateForm($('#systemName'));
</script>

 

It properly sets the selected index and then it's supposed to update the form. I know the function works the way it's supposed to because i have it in the onclick event as well. It just isn't working like this however.

 

The way its used in the onclick is updateForm(this);

[KevinM1]

Sure you could, if you don't require the function firing when the user does some action.

 

That's what I thought but I am using it like this

 

<script type='text/javascript'>
document.getElementById('systemName').selectedIndex=0;
updateForm($('#systemName'));
</script>

 

It properly sets the selected index and then it's supposed to update the form. I know the function works the way it's supposed to because i have it in the onclick event as well. It just isn't working like this however.

 

Are you getting any Firebug errors?  What should be updated when the form executes correctly?

[aeroswat]

Sorry I'm slow >< What is firebug?

 

Basically what it does is I have a select box on the left side and several controls (text boxes, etc) that update based on what is selected on the left side. I want it to be filled in with the information corresponding to the selection on the left side when the page is loaded up. The select box's contents are generated from a database and then the corresponding information is read from the database so I am using ajax to hit the php file. This is a copy of my function

 

		function updateForm(ctrl) {
		var ss = ctrl.value;
		$.ajax({
			type: "POST",
			url: "lookup-systeminfo.php",
			data: "ss="+ss+"", 
			async: false,
			success: function(msg){
				var msg=msg.substr(0,msg.search("#STOP#"));
				if(msg.length >0) {
					msg = msg.split(";");
					document.getElementById('sysName').value = msg[0];
					document.getElementById('Account').value = msg[1];
					document.getElementById('Region').value = msg[2];
					document.getElementById('Adult').value = msg[3];
					document.getElementById('Reallocations').value = msg[4];
				}
			}
		});
	}

[KevinM1]

Sorry I'm slow >< What is firebug?

 

An extension for Firefox that is incredibly useful for debugging JavaScript (among other things).  No serious developer should be without it.  Link: https://addons.mozilla.org/en-US/firefox/addon/1843

 

Basically what it does is I have a select box on the left side and several controls (text boxes, etc) that update based on what is selected on the left side. I want it to be filled in with the information corresponding to the selection on the left side when the page is loaded up. The select box's contents are generated from a database and then the corresponding information is read from the database so I am using ajax to hit the php file. This is a copy of my function

 

		function updateForm(ctrl) {
		var ss = ctrl.value;
		$.ajax({
			type: "POST",
			url: "lookup-systeminfo.php",
			data: "ss="+ss+"", 
			async: false,
			success: function(msg){
				var msg=msg.substr(0,msg.search("#STOP#"));
				if(msg.length >0) {
					msg = msg.split(";");
					document.getElementById('sysName').value = msg[0];
					document.getElementById('Account').value = msg[1];
					document.getElementById('Region').value = msg[2];
					document.getElementById('Adult').value = msg[3];
					document.getElementById('Reallocations').value = msg[4];
				}
			}
		});
	}

 

My jQuery is a bit rusty, but shouldn't 'async' be set to true?

 

EDIT: the function may not like the way you're passing the element to it... try doing it the vanilla JS way, like:

 

var systemName = document.getElementById('systemName');
systemName.selectedIndex = 0;
updateForm(systemName);

[aeroswat]

Sorry I'm slow >< What is firebug?

 

An extension for Firefox that is incredibly useful for debugging JavaScript (among other things).  No serious developer should be without it.  Link: https://addons.mozilla.org/en-US/firefox/addon/1843

 

Basically what it does is I have a select box on the left side and several controls (text boxes, etc) that update based on what is selected on the left side. I want it to be filled in with the information corresponding to the selection on the left side when the page is loaded up. The select box's contents are generated from a database and then the corresponding information is read from the database so I am using ajax to hit the php file. This is a copy of my function

 

		function updateForm(ctrl) {
		var ss = ctrl.value;
		$.ajax({
			type: "POST",
			url: "lookup-systeminfo.php",
			data: "ss="+ss+"", 
			async: false,
			success: function(msg){
				var msg=msg.substr(0,msg.search("#STOP#"));
				if(msg.length >0) {
					msg = msg.split(";");
					document.getElementById('sysName').value = msg[0];
					document.getElementById('Account').value = msg[1];
					document.getElementById('Region').value = msg[2];
					document.getElementById('Adult').value = msg[3];
					document.getElementById('Reallocations').value = msg[4];
				}
			}
		});
	}

 

My jQuery is a bit rusty, but shouldn't 'async' be set to true?

 

I don't want it to be asynchronous Anywho I'll check into that firebug. Thankyou. I'll let you know what turns up in a minute.

[aeroswat]

So I just have it enabled and it should catch most errors? If so it's not catching anything.

[KevinM1]

So I just have it enabled and it should catch most errors? If so it's not catching anything.

 

Yeah, it should work out of the box.

 

I guess the only thing left to do is create a small test script and slowly add the functionality you want to it to see where it breaks.  See if you can get a function to execute after page load, then see if it can perform the AJAX-y stuff you want, etc.

 

Dumb question - you are attempting to invoke your function within $(document).ready() or at the end of the HTML, right?

[aeroswat]

So I just have it enabled and it should catch most errors? If so it's not catching anything.

 

Yeah, it should work out of the box.

 

I guess the only thing left to do is create a small test script and slowly add the functionality you want to it to see where it breaks.  See if you can get a function to execute after page load, then see if it can perform the AJAX-y stuff you want, etc.

 

Dumb question - you are attempting to invoke your function within $(document).ready() or at the end of the HTML, right?

 

Sorry i'm fairly retarded when it comes to Javascript >< I thought that I could invoke the function in the body section of the html? Is this wrong? I thought before when I echoed it in php I didn't need anything else but the javascript function.

So would I do this?

 

$(document).ready(updateForm($('#systemName')));

[KevinM1]

So I just have it enabled and it should catch most errors? If so it's not catching anything.

 

Yeah, it should work out of the box.

 

I guess the only thing left to do is create a small test script and slowly add the functionality you want to it to see where it breaks.  See if you can get a function to execute after page load, then see if it can perform the AJAX-y stuff you want, etc.

 

Dumb question - you are attempting to invoke your function within $(document).ready() or at the end of the HTML, right?

 

Sorry i'm fairly retarded when it comes to Javascript >< I thought that I could invoke the function in the body section of the html? Is this wrong? I thought before when I echoed it in php I didn't need anything else but the javascript function.

 

There are generally two '100% safe' places/ways to get JavaScript to run immediately after page load:

 

1. In the head element, with all executing code inside of the window.onload() event, or, in jQuery's case, inside of $(document).ready().  In other words:

 

<!DOCTYPE html>
<html>
   <head>
      <script type="text/javascript">
         window.onload = function() {
            // all executable code goes here
         }
      </script>
   </head>

   <body>
   </body>
</html>

 

OR

 

<!DOCTYPE html>
<html>
   <head>
      <script type="text/javascript" src="where/you/have/your/jQuery.js"></script>
      <script type="text/javascript">
         $(document).ready() {
            // all executable code goes here
         }
      </script>
   </head>

   <body>
   </body>
</html>

 

2. At the very end of the HTML, like so:

 

<!DOCTYPE html>
<html>
   <head>
      <!-- if you need a title, css, whatever -->
   </head>

   <body>
   </body>

   <script type="text/javascript">
      // executable code goes here
   </script>

</html>

 

OR

 

<!DOCTYPE html>
<html>
   <head>
      <script type="text/javascript" src="where/you/have/your/jQuery.js"></script>
   </head>

   <body>
   </body>

   <script type="text/javascript">
      // executable code
   </script>

</html>

 

The reason for this is that JavaScript tends to get loaded, and thus tends to execute, before the HTML is fully rendered.  This, in turn, leads to the script attempting to access elements that literally don't exist when the script runs, resulting in errors.  You can put script elements within the body of your document, but there's no guarantee you'll be able to access the elements that occur after those script blocks.  That's why it's best to wait until the entire HTML document is loaded before attempting to execute code, or otherwise obtain references to HTML elements.

 

Regarding method 1 vs. 2, 2 is a bit easier/less cluttered to write.  It may also be a bit faster, as you don't need to wait for an event to fire and execute an event handler to get your code to work.

 

This sort of runtime error may not be the cause of your problem, but you should always keep it in mind when writing JS.  It's the cause of a lot of headaches.

[aeroswat]

Thank you for your help. It hasn't worked yet but i'll take a look at it again later. I gotta go for now. Thanks again and I'll let ya know what I find out!