0

In my previous question a poster suggested the following:

var formSubmitHandler = function (link, form) {
    var $form = $(form);
    var val = $form.valid();
    var action = $form.data('action');
    var entity = $form.data('entity');

I understand now that the $ before is used to show the variable is a jQuery object. My question is Why do I need the line "var $form = $(form)" ? Could I not just have $form = form?

Community
  • 1
  • 1
  • 2
    `var $form = $(form)` is equivalently to `var $form = jQuery(form)`. You are passing `form` to the jQuery *function* to get a jQuery object. The `$` in this case refers to a function. Of course if `form` is already a jQuery object, then you don't have to pass it again. But we don't know what you pass to `formSubmitHandler`. – Felix Kling May 04 '12 at 07:18
  • I'm passing formSubmitHandler(link, $('#main-form')); –  May 04 '12 at 07:22
  • Then you wouldn't need it. You could define your function as `var formSubmitHandler = function (link, $form) {` if you want the name as `$form`. – Felix Kling May 04 '12 at 07:23

9 Answers9

2

In jQuery, $(something) is just a shorthand for jQuery(something) but since typing jQuery repeatedly is tedious, $ is used.

In JavaScript can be used in an identifier. So you could have ca$h = 100 and that's just as well as cash = 100. Generally though, you should avoid such variable names.

jQuery could just as well have stuck to j(something) instead of $(something) but I guess at the time $ was unique enough that it wouldn't conflict with any other existing functions or variable names. I have seen some other JavaScript libraries used both $ and $$ for different things.

aleemb
  • 31,265
  • 19
  • 98
  • 114
1

There are two pieces to this question.

First: var makes $form be a variable with local scope. If you omit it and write

$form = "foo";

then it's as if you had written

this.$form = "foo";

which is something completely different. If there is no code messing around with what this is inside the function, by default this would be equal to window and you would be setting a global variable.

Second: var $form = form simply makes $form be a copy of form -- not very useful. But

var $form = $(form)

makes $form be a jQuery wrapper around whatever form is -- which again, is another thing entirely because it means you can now call jQuery methods on $form.

Jon
  • 428,835
  • 81
  • 738
  • 806
1

$ is the same as jQuery. This basically makes sure the 'form' variable is a jQuery object and not a plain dom object.

It is the same as writing jQuery(form)

KillerX
  • 1,436
  • 1
  • 15
  • 23
1

No, you can't. $() makes you able to use jQuery's methods on DOM elements. If you had written $form = form, you wouldn't have been able to call .valid() and .data() on your $form element.

sp00m
  • 47,968
  • 31
  • 142
  • 252
1

No, the $() is the jQuery object. In JavaScript, you do not need to use $ before variables but in PHP you do... Some programmers are use to using variables that start with a $ so for their own consistency they use a $ in both PHP and JavaScript to keep things uniform and less confusing for them. You could write that example like this however:

var form = $(form);
JT Smith
  • 741
  • 4
  • 12
  • 1
    +1 but also keep in mind that its a good practice if you add the $ before your `form`, so you know that there is a jQuery Object assigned and not a normal Javascript object. – mas-designs May 04 '12 at 07:36
1

You could, but then it would mean that you expect your form parameter to be something that supports both .valid() and .data() which I guess is not what you want.

By going thought var $myvar=$(myvar) You are enhancing myvar with all the abilities added by jquery like asking about .width() or .height() and more and allowing yourself to send in selectors instead of of actual objects.

so your formSubmitHandler function could be called like this: formSubmitHandler(link,'.classname_of_form') or formSubmitHandler(link,'#id_of_form') and so on.

epeleg
  • 10,347
  • 17
  • 101
  • 151
1

The important thing is that you understand that $(form) is the same than jQuery(form).

Constructing a variable in Javascript like that - jQuery('#myThing') or $('#myThing'), then, is the same.

Once you understand that, a step ahead:

Programmers have something that they like to call 'Standards', just to make the code more easy to read. And for the sake of this, the CONVENTIONAL way to SHOW the reader that a variable contains a jQuery variable, and not only a normal Javascript variable, you put a $ in front.

So you have $form = jQuery(form); or the same thing, $form = $(form).

Conventions could have been different, let's say, IAMJQUERYTHING!_form instead $form, but this is how its accepted :)

Another step ahead, by the way: Writing $(form) makes a jQuery var, same as jQuery(form), but in some cases using some libraries make conflicts appears when using $ instead jQuery. That's why I started using jQuery instead $ in a regular basis.

Hope this helps!

Hector Ordonez
  • 1,044
  • 1
  • 12
  • 20
0

form is the dom element, $form is a jQuery object selecting said dom element. jQuery has cool functions one can perform, the dom element has differnet functions and properties. Consider this utterly unrelated example:

html:

<div id="#someid">hi</div>

javascript:

var $someid = $("#someid");
var someid = document.getElementById("someid");
var content = $someid.html(); // returns 'hi'
var content2 = someid.innerHTML; // returns 'hi'

Note how the jQuery .html() function is different than the dom .innerHTML property.

robrich
  • 13,017
  • 7
  • 36
  • 63
0

Just adding a dollar sign doesn't make it a jQuery variable. Calling $() returns a jQuery object. So if you name a regular HTML element with a dollar sign, other developers would expect to be able to call form.show(), but that would throw an error because a plain form element doesn't have a show method

Ruan Mendes
  • 90,375
  • 31
  • 153
  • 217