Question

I have problem with passing an argument to my simple function in jQuery:

When function is attached directly to the element everything is OK.

 $companyNameInputs.bind('blur keyup',function(){
    if ($(this).hasClass('required')) {
        if (this.value == ''){
            $(this).addClass('inputError');
        }else {
            $(this).removeClass('inputError');
        }
    }
}); 

but when I want to declare this simple check as an different function it doesn’t work:

this is my function:

 var standardCheck = function($param){
    $param.addClass('inputError');
    if ($param.hasClass('required')) {
        if ($.trim($param).value == ''){
            $param.addClass('inputError');
        }else {
            $param.removeClass('inputError');
        }
    }
};

and this is how I call it:

  $companyNameInputs.bind('blur keyup',function(){
    standardCheck($(this));
});

variable declaration:

  var $companyNameInputs = $("#companyName")

and the HTML:

 <div>
     <p>
            <input class="text_input" type="text" id="companyName" name="companyName" value="" />
     </p>   
 </div>

please help.

Answer 1

Since param is a jQuery container, you have to call .val() and trim the output of that:

   if ($.trim($param.val()) == ''){

or get the corresponding DOM element and its value property.

   if ($.trim($param[0].value) == ''){