Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JavaScript/jQuery - "$ is not defined- $function()" error

I am trying to run a JavaScript/jQuery function and Firebug gets the error:

$ is not defined $(function()". 

The JavaScript code is placed inside a file called core.js and referenced by index.php. What causes this error?

JavaScript:

<script type="text/javascript">     var formObject = {         run : function(obj) {             if (obj.val() === '') {                 obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);             } else {                 var id = obj.attr('id');                 var v = obj.val();                 jQuery.getJSON('/mod/update.php', { id : id, value : v }, function(data) {                     if (!data.error) {                         obj.next('.update').html(data.list).removeAttr('disabled');                     } else {                         obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);                     }                 });             }         }     };      $(function() {          $('.update').live('change', function() {             formObject.run($(this));         });      }); </script> 

PHP/HTML

<html>     <select name="main" id="category" class="update">     <option value="">Select one</option>          <? if (!empty($list)) { ?>             <? foreach($list as $row) { ?>                 <option value="<?php echo $row['id']; ?>">                     <? echo $row['name']; ?>                 </option>              <? } ?>         <? } ?>      </select> </html> 
like image 758
CodingWonders90 Avatar asked May 28 '12 03:05

CodingWonders90


2 Answers

You must not have made jQuery available to your script.

Add this to the top of your file:

<script type="text/javascript" src="https://code.jquery.com/jquery-1.7.1.min.js"></script> 

This issue is related to the jQuery/JavaScript file not added to the PHP/JSP/ASP file properly. This goes out and gets the jQuery code from the source. You could download that and reference it locally on the server which would be faster.

Or either one can directly link it to jQuery or GoogleCDN or MicrosoftCDN.

How do add jQuery to your webpage

like image 158
Ketan Avatar answered Oct 01 '22 22:10

Ketan


Try:

(function($) {     $(function() {         $('.update').live('change', function() {             formObject.run($(this));         });     }); })(jQuery); 

By using this way you ensure the global variable jQuery will be bound to the "$" inside the closure. Just make sure jQuery is properly loaded into the page by inserting:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 

Replace "http://code.jquery.com/jquery-1.7.1.min.js" to the path where your jQuery source is located within the page context.

like image 41
Fagner Brack Avatar answered Oct 01 '22 21:10

Fagner Brack