How to Pass Dummy jQuery Object to Javascript function

Question

Hello all,

I have a javascript function that, in most cases, needs to do something with a jQuery object that I pass it. There is a single exception where the function will not need a jQuery object, but because I've written it to accept a string (the command) and a jQuery object, I need something to pass it when I call it. My function is below:

function handleNotes(command, $item) {

        var $textArea = $('#textarea_' + currentDialog); // currentDialog = global var
        var $notesDiv = $('#' + $item.attr('id') + "_notes");

    switch (command) {
     case "show":
      // do something with $notesDiv and $textArea
      break;
     case "hide":
      // do something with $notesDiv and $textArea
      });
      break;
     case "hide only":
      // do something with $textArea only
    }
}

My function call where I have the problem is:

handleNotes("hide only");

I've tried handleNotes("hide only", null), and I've tried handleNotes("hide only", Object) with no luck. Any ideas?

Thanks.

UPDATE

So as many people answered, it turns out I was not testing for $item being null, so it was trying to set to something each time (whether an object was passed to it or not). I changed my function code to this:

function handleNotes(command, $item) {

    var $textArea = $('#textarea_' + currentDialog); // currentDialog = global var

    if($item) {  // if not null
        var $notesDiv = $('#' + $item.attr('id') + "_notes");
    }

    switch (command) {
     case "show":
      // do something with $notesDiv and $textArea
      break;
     case "hide":
      // do something with $notesDiv and $textArea
      });
      break;
     case "hide only":
      // do something with $textArea only
    }
}

And my function call to: handleNotes("hide only", null);

Seems to work fine. And as an answer to my original question, it would appear that "null" will suffice as a blank or dummy object, or it doesn't need to be passed at all, in which case the function assigns it a null value automatically. Thanks for the responses.

Answer 1

You can avoid the error by testing to see if $item is set before trying to accessing it's attr method, like such:

function handleNotes(command, $item) {

if ($item) {
...

    var $textArea = $('#textarea_' + currentDialog); // currentDialog = global var
    var $notesDiv = $('#' + $item.attr('id') + "_notes");

    etc..

Then if you call the method using handleNotes("hide only", null) you'll avoid executing the code you want to execute against with your jQuery object..

Answer 2

In JavaScript it's fine to call a function with less arguments then it declares - but you have an error because your code in the function always attempts to access $item.

If you rewrite the function so that you only access $item when you need to use it, you should be able to avoid these errors.

function handleNotes(command, $item) {

    var $textArea = $('#textarea_' + currentDialog); // currentDialog = global var
    var $notesDiv;
    if (command == "show" || command == "hide") {
        $notesDiv = $('#' + $item.attr('id') + "_notes");
    }

    switch (command) {
     // ...
    }
}

Answer 3

Its probably because you are using $item, without knowing if it can be used. try:

var $notesDiv = $item ? $('#' + $item.attr('id') + "_notes") : null;

Answer 4

It looks like your having problems because your trying tom access attr on item when it isn't passed. You should just be making sure that member exists before you access it.

ie.

if(item && item.attr)

Answer 5

You can also construct an empty jQuery set like so:

jQuery([])

That'll give you a set with zero elements, just like if you said jQuery("#asdfkadskfkdfas"). All the jQuery methods will work on that without throwing exceptions, even though most will return the legal value undefined. So your example would be:

handleNotes("hide only", jQuery([]));

But, the better solution is to restructure your function, as the accepted answer suggests.