HTML5, CSS3, jQuery, JSON, Responsive Design...

jQuery code completion in Aptana/Eclipse

Michael Brown   March 30 2012 03:21:00 PM
Recently, I've been leaning towards Aptana Studio as my preferred JavaScript IDE.  It's based on Eclipse and, like Eclipse, is open source and cross platform.  You can use it either as a plug-in for Eclipse itself or as a stand alone application.  (I've only used in the latter configuration.)  Admittedly, it can be a little sluggish at times, but nothing that I can't live with.

Aptana Studio has a very neat code assist/completion feature, which looks like this for native JavaScript:

JavaScript code assist in Aptana

The code assist info will often appear automagically when you're typing.  If it doesn't, then try hitting the ctrl->space keyboard combination to bring it up.

This is great for native JavaScript, but what about for external libraries such as jQuery?  Well, here's what you get by default if you try to use code assist against some jQuery code:

jQuery without code assist in Aptana

I.e., not very much.  It shows the signatures for the jQuery methods - looked up from your project's installed jQuery library itself, presumably - but displays no information about what they're for and how they work.

However, code assist for jQuery is available for Aptana; you just need to install and enable it.  To do that, you need to
  1. Install the jQuery bundle into Aptana

  2. Enable the jQuery bundle for each project where you want to use it



Installing the jQuery bundle

From the main Aptana menu, click on Commands->Bundle Development->Install Bundle and select "jQuery" from the list dialog.  Note: on my own installations, the "jQuery" option was right at the bottom of the list, even though the rest of the list was sorted alphabetically.  Go figure.  Click the Okay button to install the jQuery bundle.   You need to do this step only once for your Aptana Studio instllation.


Adding the jQuery bundle to your project

You need to do this on a project by project basis.

Right-click on your project name in the Project Explorer and pick "Properties" from the pop-up menu.  In the resulting dialog, select "Project Build Path".  You should now see a list of jQuery library versions, as shown below:

Choosing jQuery bundle for your project

Select (i.e. tick) the library version that you're using (or closest to it) and click the okay button.

Now type some jQuery code into a file from within that project.  Code assist jQuery code should nowl bring up some more meaningful information.  Again, you may have to hit ctrl->space to invoke the pop-up information.

jQuery with code assist in Aptana

As you can see, those dry "signature only" definitions are still there, alongside the fuller definitions.  You just need to look at the one marked as "jQuery" in the right hand column.
Comments

1beppe  10/26/2012 4:46:36 AM  jQuery code completion in Aptana/Eclipse

:-)

2Don  04/03/2014 3:50:00 PM  jQuery code completion in Aptana/Eclipse

I saw 1.6 for the jquery. how about the latest jquery 1.11? can we add this latest one?

Thanks

Don

About