callback.call is not a function

Question

I am getting this error and having a difficult time correcting it. I get the following error message: callback.call is not a function

I have posted code snippets below for comment, it seems that the error is being triggered when validateCheckBox(o) is invoked. I understand that the error is triggered from a function being out of context but not exactly sure how to fix.

function checkLength( o, n, min, max ) {
    console.log( arguments.length );
    if ( arguments.length < 4 ) {   
        // issue here with callback.call is not a function
        if ( validateCheckBox(o) ){
            validateCheckBox(o);  
        }
    }else {
        if ( o.val().length > max || o.val().length < min ) {
        o.addClass( "ui-state-error" );
        updateTips( "Length of " + n + " must be between " +
          min + " and " + max + "." );
        return false;
      } else {
        return true;
      }

    }

}

function validateCheckBox( o ) {

    var css = $(".border").css({
                                "border-color": "",
                                "border-weight": "",
                                "border-style" : "",
                                "background-color": "",
                                "background-image": "",
                                "background-repeat":"",
                                "background-position":""
                            });
    //console.log(css);
    var invalidChkBox = {   
                        "border-color":"#cd0a0a",
                        "border-weight":"1px",
                        "border-style":"solid",
                        "background-color": "#feflec",
                        "background-image": "url('lib/jquery-ui/css/images/ui-bg_glass_95_fef1ec_1x400.png')",
                        "background-repeat": "repeat-x",
                        "background-position": "50% 50%"


            }

    // throwing error callback is not defined
    var isChecked = $( "#verification" ).is(":checked");

    if ( isChecked == false || isChecked == undefined ) {

        $( ".border"  ).css( invalidChkBox );
        o.addClass( "ui-state-error" );
        $( ".validateTips" ).text( "You must agree that all information is accurate and true, by checking the box." );

    }else{
        // reported bug callback.call is not a function @error below
        $( ".validateTips" ).css( 'display', null ).text( "" );
        $( ".border"  ).css( css );



    }


}

 valid = valid && checkLength ( verification, "Verification", 1 );

Thanks in advance.

Answer 1

thanks for the help. It turned out to be something simple. I was trying to assign css rules to the class with the rules already defined on it...

var css = $(".border").css({
                                "border-color": "",
                                "border-weight": "",
                                "border-style" : "",
                                "background-color": "",
                                "background-image": "",
                                "background-repeat":"",
                                "background-position":""
                            });
$( ".border"  ).css( css ); --> line throwing error.... 

Answer 2

Based on your comment, the problem could be the 1st argument of checkLength being a string instead of a JQuery object. Looks like the calls should be more like

checkLength($("#first_name"), "First name", 3, 30 );

Note the $("#first_name") which passes through a JQuery object representing the element with id #first_name rather than just the string "#first_name" .