error: function not defined.... but it is!!!

updateEditor is not defined
  It's maddening.  The function is defined.  I call it onchange from the select statement, and console throws an error and the alert does not execute.  WTH?!?!?!  Please help me see the light here.  Thanks.

<script type="text/javascript">
	(function($) {
		$(function() {
			
			alert('kilroy');
				
			function updateEditor() {
				alert('do somehting');
			}
		
		});
	}(jQuery));
</script>

<select name="service" onchange="updateEditor();">	
	<cfset loopCount = 0>
	<cfloop query="services">
		<cfset loopcount = incrementValue(loopcount)>
		<option value="#loopcount#">#services['prodServ_title'][loopcount]#</option>
	</cfloop>
</select>

Open in new window

LVL 1
brianmfallsAsked:
Who is Participating?
 
Jerry MillerCommented:
When add levels of nesting your name grows with each level. if you wanted to nest it, you could do something like this:

<script type="text/javascript">
        (function($) {
         var kilroy =   $(function() {
                       
                        alert('kilroy');
                               
                        function updateEditor() {
                                alert('do somehting');
                        }
               
                });
        }(jQuery));
</script>

Then call it with:
<select name="service" onchange="kilroy.updateEditor();">      
        <cfset loopCount = 0>
        <cfloop query="services">
                <cfset loopcount = incrementValue(loopcount)>
                <option value="#loopcount#">#services['prodServ_title'][loopcount]#</option>
        </cfloop>
</select>

0
 
brianmfallsAuthor Commented:
SOlved it....  take the function out of the following block.

 
	(function($) {
		$(function() {

                     ..................

		});
	}(jQuery));

Open in new window


Tell me why and the points are yours.
0
 
Jerry MillerCommented:
I don't think that you can normally nest functions in that way and I am not sure why you would even want to. Declare the functions independent of each other and nest the function calls if you need the nesting to perform actions.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
Jerry MillerCommented:
It is not defined because you are calling the name updateEditor() and it would most likely be some javascript name with placeholders in front of it to point to the other two functions.
0
 
brianmfallsAuthor Commented:
Why though?  Just to satisfy my curiosity.  Why can I nest the functions there?
0
 
Michel PlungjanIT ExpertCommented:
It is defined inside an anonymous function and is therefore only visible inside that function

What you CAN (and should) do is this http://jsfiddle.net/mplungjan/NpL4J/


$(document).ready(function() {
  $("#service").change(function() {
    alert("do something");
  });
});

<select id="service" name="service">
    <option value="">Please select</option>
    <option value="1">One</option>
</select>

Open in new window

0
 
brianmfallsAuthor Commented:
Thanks guys.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.