Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript callback function throws error "Callback is not a function" in firefox

Tags:

javascript

function CascadeDropDowns(parentClass, childClass, action, callback) {   var DropDownId = $(parentClass + " option:selected").val();    $.ajax({     url: "/site/" + action,     data: { DropDownId: DropDownId },     dataType: "json",     type: "POST",     error: function () {       alert("An error occurred.");     },     success: function (data) {       var items = "";       $.each(data, function (i, item) {         items += "<option value=\"" + item.Value + "\">" + item.Text + "</option>";       });       $(childClass).html(items);       $(childClass)[0].selectedIndex = 0;       callback();     }   }); }  $(document).ready(function () {   // Populates all child drop downs on load   var callback = function () {     CascadeDropDowns(".ConfigGroupDDL", ".ConfigNameDDL", "GetParameters");   };    CascadeDropDowns(".DeviceTypeDDL", ".ConfigGroupDDL", "GetGroups", callback);    // Populates all child drop downs parent change   $(".DeviceTypeDDL").change(function () {     var callback = function () {       CascadeDropDowns(".ConfigGroupDDL", ".ConfigNameDDL", "GetParameters");     };     CascadeDropDowns(".DeviceTypeDDL", ".ConfigGroupDDL", "GetGroups", callback);   });   $(".ConfigGroupDDL").change(function () {     CascadeDropDowns(".ConfigGroupDDL", ".ConfigNameDDL", "GetParameters");   }); }); 

This runs fine and cascades the dropdowns in the right order, but firefox debugger shows an error and ie throws an alert and asks if Id liek to debug.

Any advice would be great

like image 622
DavidB Avatar asked Apr 09 '13 14:04

DavidB


People also ask

Is not a function callback?

The "callback is not a function" error occurs when we define a callback parameter to a function, but invoke the function without passing a callback as a parameter. To solve the error, provide a function as a default parameter, or always provide a parameter when calling the function.

What is callback () in JavaScript?

A callback is a function passed as an argument to another function. This technique allows a function to call another function. A callback function can run after another function has finished.

Is callback the same as function?

The callback is a function that's accepted as an argument and executed by another function (the higher-order function). There are 2 kinds of callback functions: synchronous and asynchronous. The synchronous callbacks are executed at the same time as the higher-order function that uses the callback.

What is the problem with callbacks?

This is a big issue caused by coding with complex nested callbacks. Here, each and every callback takes an argument that is a result of the previous callbacks. In this manner, The code structure looks like a pyramid, making it difficult to read and maintain.


2 Answers

It is because you are not always passing the callback into that method.

success: function (data) {   var items = "";   $.each(data, function (i, item) {     items += "<option value=\"" + item.Value + "\">" + item.Text + "</option>";   });   $(childClass).html(items);   $(childClass)[0].selectedIndex = 0;   if(callback) callback();  //check before calling it.  } 
like image 195
epascarello Avatar answered Oct 17 '22 13:10

epascarello


It's because you are not always providing a callback to the CascadeDropDowns function.

E.g.

CascadeDropDowns(".ConfigGroupDDL", ".ConfigNameDDL", "GetParameters");

You should modify your function to treat the callback argument as an optionnal argument:

if (callback) {     callback(); } 

A common shorthand for that is:

callback && callback(); 
like image 38
plalx Avatar answered Oct 17 '22 15:10

plalx