File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
http://aspose.com/file-tools
The moose likes HTML, CSS and JavaScript and the fly likes $(function()) and $( Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "$(function()) and $("#popupDatepicker39") syntax questions" Watch "$(function()) and $("#popupDatepicker39") syntax questions" New topic
Author

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

Scott Emrick
Greenhorn

Joined: Oct 14, 2009
Posts: 6
Can anyone explain what this code does? I'm particularly confused by the $() syntax and the "#popupDatePicker39" syntax.

Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

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"?


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

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

Joined: Jan 10, 2002
Posts: 61413
    
  67

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

Joined: Oct 14, 2009
Posts: 6
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

Joined: Jan 10, 2002
Posts: 61413
    
  67

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

Joined: Aug 11, 2007
Posts: 4659
    
    5

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

Joined: Oct 14, 2009
Posts: 6
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

Joined: Jan 10, 2002
Posts: 61413
    
  67

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

Joined: Oct 14, 2009
Posts: 6
Yes, I think this is it:
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

You also need to import jQuery UI.
Gregg Bolinger
GenRocket Founder
Ranch Hand

Joined: Jul 11, 2001
Posts: 15299
    
    6

Bear Bibeault wrote:You also need to import jQuery UI.


And make sure you grab jQueryUI's stylesheet as well.


GenRocket - Experts at Building Test Data
 
It is sorta covered in the JavaRanch Style Guide.
 
subject: $(function()) and $("#popupDatepicker39") syntax questions