Win a copy of Mesos in Action this week in the Cloud/Virtualizaton forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

$(function()) and $("#popupDatepicker39") syntax questions

 
Scott Emrick
Greenhorn
Posts: 6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Can anyone explain what this code does? I'm particularly confused by the $() syntax and the "#popupDatePicker39" syntax.

 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64843
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Don't the let the $ fool you -- it's just an identifier like any other. Would you still be confused if you replace the $ with the name "xyz"? Or, "jQuery"?
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64843
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Scott Emrick wrote: and the "#popupDatePicker39" syntax.
The notation "#anything" is a jQuery selector that uses the same syntax as CSS3 selectors. This particular one means "the element whose id is popupDatePicker39".
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64843
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
More:

The $ is just a popular short-hand synonym for the jQuery function. So anywhere you see the $() function used, you could use jQuery() instead.

So the posted code is entirely equivalent to:
Does that help you grok it any?

(If not, I can go into further detail...)
 
Scott Emrick
Greenhorn
Posts: 6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks for your quick reply!

Interesting! I'd never heard of JQuery. I guess I need to Google that and read up on it.

So this code is creating a function that runs a date popup defined in the css in the popupDatepicker39 element and sets the changeMonth and changeYear to true.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64843
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Scott Emrick wrote:Interesting! I'd never heard of JQuery. I guess I need to Google that and read up on it.

Yes, this code is using the jQuery and jQuery UI JavaScript libraries.

So this code is creating a function that runs a date popup defined in the css in the popupDatepicker39 element and sets the changeMonth and changeYear to true.


More specifically, this code is establishing a "ready handler" that will be called when the DOM is completely loaded. In the handler, a DOM element with the specified id is turned into a date picker (which is part of jQuery UI).

Click on the "Books by Bear" link in my sig if you're interested in a book on jQuery and jQuery UI.
 
Pat Farrell
Rancher
Posts: 4678
7
Linux Mac OS X VI Editor
  • Likes 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Scott Emrick wrote:Thanks for your quick reply! Interesting! I'd never heard of JQuery. I guess I need to Google that and read up on it.

I highly recommend @Bear's book on jQuery.
 
Scott Emrick
Greenhorn
Posts: 6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
So I should be able to find a definition of popupDatepicker39 in a .css file, somewhere in the web app, correct? I'm only finding references to it, no place where it is defined.

When I run the web app in IE, it says "Microsoft JScript runtime error: Object doesn't support this property or method", and it highlights the inside of the function:



Other parts of the app use this same code without errors.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64843
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Scott Emrick wrote:So I should be able to find a definition of popupDatepicker39 in a .css file

No. It's the id of an element.

When I run the web app in IE, it says "Microsoft JScript runtime error: Object doesn't support this property or method", and it highlights the inside of the function:

Is the page including the required script files?
 
Scott Emrick
Greenhorn
Posts: 6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Yes, I think this is it:
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64843
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
You also need to import jQuery UI.
 
Gregg Bolinger
GenRocket Founder
Ranch Hand
Posts: 15302
6
Chrome IntelliJ IDE Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:You also need to import jQuery UI.


And make sure you grab jQueryUI's stylesheet as well.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic