Netbeans 7 - jquery code completion [duplicate] - javascript

I'm using NetBeans for PHP.
When I edit a .js file, it gives me javascript code completion.
How can I get it to also give me jQuery code completion?

First go to Tools -> Options -> Miscellaneous and click on the Javascript tab,
make sure the targeted browsers are configured properly, code completion changes by the minimal version of the targeted browsers to make sure that the functionality is supported.
You also need to add the jquery js file to your project so netbeans would be able to parse it and to properly add code completion.

These answers are misleading because jQuery no longer self-documents using "scriptdoc." Version 1.1.4 was the last to have this. Anything newer than that (>=1.2 ~mid-2007) is gutted.
amending that: VSdocs actually work:
http://code.jquery.com/jquery-1.4.1-vsdoc.js
or http://www.asp.net/ajaxlibrary/cdn.ashx for version after 1.4.1

i suspect using a non-minified version of jquery would help.

For Netbeans 6.7 / 6.8 / 6.9, just follow the guide here:
Using jQuery to Enhance the Appearance and Usability of a Web Page
There's a section about half way down called "NetBeans Code Completion and API Support".
Worked no problem for me.
Note: "Choose the uncompressed version, i.e., 'Development', before downloading the jQuery library. Using the uncompressed version will allow you to examine the JavaScript code in the editor, and aid in any debugging processes."
Tip: Tools / Options / Miscellaneous / JavaScript. In the "Targeted Browsers" section, ensure IE is "6 or later". Otherwise, you'll get "Not supported" errors in the code completion pop-up and a lot of the commands will be struck out.

I use netbians 7.x for development on drupal 6.x. Autocomplete works after adding non-minified version jquery-1.2.6.js file to the root folder of the project (so it will be with any version).
It is important to specify the version of the file name, without -1.2.6 will not work!

The basic rule is that your jQuery (or for that matter any js lib) should be found in the same project you need auto complete to work. So just place jquery-1.x.y.js somewhere in your project (that can be reached by NetBeans as it reaches your js file) and you should be good to go.
To test you can put the jQuery file in the same folder as your js file being edited.

Make sure your Internet connection is working, because NetBeans downloads documentation when is needed. I think that NetBeans downloads it from there, but this is only my assumption. This is parsing friendly XML document with whole and recent jQuery documentation.

Related

How do I use WebStorm for Chrome Extension Development?

I just bought WebStorm 5 and so far have been really enjoying its Inspection features. One hitch I've run in to when developing my Chrome extension is that it doesn't recognize the chrome variable:
Is there a way I can add the chrome variable to the Inspector so that it can autocomplete as I type? I'm guessing I would need to add Chromium as an External Library but I'm unsure where to start.
First Time Setup
Open the Settings dialog (File > Settings)
Click Languages & Frameworks > Javascript > Libraries
Click Download
Make sure TypeScript community stubs is selected
Select chrome from the list (you can find it quickly by just typing chrome)
Click Download and Install
Click OK to close the Settings dialog.
Steps 2-6 illustrated below:
In Subsequent Projects
In any subsequent project, you just:
Open the Settings dialog again (File > Settings)
Click Languages & Frameworks > Javascript > Libraries again
Check chrome-DefinitelyTyped
Click OK to close the dialog.
Steps 2-4 shown below:
UPDATE 2:
It's now supported out of the box, see the complete answer below.
UPDATE:
There is a more complete stub file that can be added as a library to get code completion. It's a part of the Closure Compiler project. Download chrome_extensions.js.
See also the feature request for WebStorm to add this library automatically from the IDE.
You need to get the JavaScript library for the Chrome API somewhere, or use a stub to get basic completion.
Library or a stub can be configured in WebStorm.
I found the JSON files with the Extension API. One can write a script that will build JS stubs from these JSON files, the stubs can look like the basic version linked on GitHub above, but with the automatic generation they will contain almost complete API and JSDoc comments so that documentation like here can be viewed directly in the IDE.
JSON => JavaScript object stubs mapping is pretty straightforward in this case and writing this kind of converter should not take more than a day (or several hours for the skilled coder).
If someone goes ahead and implements it, please post the link to the results here.
WebStorm should one day accept json definitions directly to enable autocomplete for the functions defined. Meanwhile, you can use the program at https://github.com/QuickrWorld/jsgen to convert the json files to js to enable auto-complete for the chrome extension APIs.
For writing AppScript, functions and classes such as DriveApp, SpreadsheetApp, there is a plugin in WebStorm or Intellij called google-app-script.
The installation method is the same as above. On the other hand, you should mark or open the .gs file as JavaScript. (July 2017)

Where does load-scripts.php load jquery.js file from?

I try to debug a javascript function called from Generate Thumbnails plugin in Wordpress. The function uses jquery. So the actual call that I want to debug occurs in jquery.
The problem is that default jquery.js inside Wordpress is minimized and therefore obscure. I changed that file with the uncompressed version of jquery.js file in wp-includes\js\jquery.
But when I debug that function with Firebug's debugger, Firebug still shows me the old, minimized version of jquery:
I copied the location of the script file shown in Firebug and opened it in browser: http://localhost/wordpress/wp-admin/load-scripts.php?c=1&load=jquery,utils,jquery-ui-core,jquery-ui-widget&ver=368b0ffbc13bc55b5ae45ad40a5368d9
This time, the true, uncompressed version of jquery.js was opened.
It seems like Firebug opens the old version of jquery. I restarted the Firefox but it wasn't resolved.
What might be the reason of this problem? Is this Firebug related or Wordpress related?
I'd agree with the people who commented on your question - it seems like a browser cache problem.
If it's a test system, one thing I'd suggest is setting the WP_DEBUG constant to true in your wp-config. That'll download the uncompressed versions of the javascript libraries. That has two advantages:
You don't have to copy different javascript files around, and
The file names differ from the standard ones (they have .dev in them, from memory), so you shouldn't hit any caching issues.
I'm assuming there's an uncompressed version of jquery in WordPress. Apologies if there isn't; I haven't checked. But in general I'd recommend this approach.
See Debugging in WordPress in the codex for more information.

Eclipse Indigo with Aptana Studio 3 - Code hinting doesn't work when Dojo libraries are local

I've just setup Eclipse with Aptana Studio 3 and have been trying to get code completion / code hinting / autocomplete to work with mixed results.
I've followed the instructions here: http://wiki.appcelerator.org/display/tis/JavaScript+Library+Support
What I have discovered through testing is that when you install the .sdocml file and nothing else in a new project, it works fine.
As soon as I add a local copy of Dojo into the project the code hinting no longer works correctly.
I tried excluding the directory from view with a filter but that excludes it from the server so you can't use it. I've also tried removing the Dojo folder from Indexing but that changes nothing either.
If I load Dojo from a CDN, like Google, then I can use code completion.
The issue is that Eclipse picks up a parsed reference to dojo instead of the one from the sdocml file.
The problem seems, so far, to be confined to typing 'dojo.' but 'dijit.' and 'dojox.' work okay, maybe because of the parent-child relationship between those sub-libraries, if I were to guess.
I don't know if this is an Aptana bug or an Eclipse bug, but either way, it's a problem.
Does anyone know how to prioritize the code hinting sources and / or exclude certain directories from being a hinting source? Or is there another solution?
Thanks in advance,
Ken
Edit: Now that I have more code in the test project hinting does not work at all for 'dojo.' but still works fine for 'dojox.' and 'dijit.'. Only native JS methods hinting is available as a subset of 'dojo.'

what is the use and purpose of uncompressed version of jquery library file provided by jquery.com?

Jquery.com provide 2 version of jquery library. I always use Minified version because i never edit anything in jquery base file. but what is the use and purpose of another Uncompressed Code version? Does people edit main library file to get something?
If yes then if we edit anything in main file then we can't use google ajax library link.
Production (19KB, Minified and Gzipped)
Development (120KB, Uncompressed Code)
If you're using the minified version during development, browsers will tell you there's an error on line X, but line X might consist of hundreds or even thousands of lines of uncompressed code. This makes it very, very difficult to figure out what exactly caused the problem.
Developing against uncompressed code thus allows you to see what's causing problems and fix. Minified jQuery should always be used in production, and the core functionality of jQuery shouldn't be tweaked - that's what plugins are for.
edit 5/2014: Source maps have been implemented in many browsers to allow debugging of minified code. https://developers.google.com/chrome-developer-tools/docs/javascript-debugging#source-maps
It just makes it much easier to read the source code of jQuery, especially during debugging to see what is happening with a problem in your application.
It's for Debugging (although I would argue that if you're using jQuery, you should be looking through the source to understand it).
In ASP.NET at least, when using the ScriptManager control, you can assign one script to use in Debug mode and another to use in Release mode, so using the uncompressed version in debug allows you to step through the source and figure out if an issue you're having is coming from there, but when you finally build the release, you'll use the minified and gzipped version.

Adding additional js files breaks jQuery IntelliSense

I have been using jQuery IntelliSense in VS2008 and it has been great. Recently I added a reference to jQuery UI and since then, the jQuery IntelliSense has went away. I found that once you reference another .js file in your document, the IntelliSense goes away. Any way to avoid this?
If there are errors in any refernced files it will break intellisense for all files references from the same document. The next version of Visual Studio is going to be much more robust in this respect. I apologize directly for this fragility. We made some design decisions early on that we prevented us from making VS9 external references more robust.
In the meantime, use the following workaround. Install SP1 from the link Slace gave you. If you have a reference a file named .js and there is a file named -vsdoc.js in the same location, then JS intellisense will pick up the -vsdoc version. If that script is empty then it won't generate an error. Identify the jquery plugin that is causing intellisense generation to fail and place a -vsdoc version next to it. You won't get intellisense for UI, but you will still get jquery and other plugins that do work.
Anything you put in the vsdoc version will show up in intellisense. You could put spoofed versions of the data structures that you want to display in intellisense if you want to.
It's likely that there's a bug in one of the subsiquiently referenced JavaScript files. Open your JS file and once the "Updaing JavaScript Intellisense" has gone from the status bar of Visual Studio (there is a menu option which will force the JS intellisense to refresh, don't remember where it is, I just created a keyboard shortcut via the Tools -> Options -> Keyboard area) open up your Errors window and under the Warnings you should find the reason why the intellisense has failed to load.
It's generally a bug found when parsing one of the files but I have had stack overflows when I had a lot of files referenced.
Edit: You also should make sure you have this VS patch installed: http://code.msdn.microsoft.com/KB958502 and VS 2008 SP1 (install SP1 first!). Then you just need to have:
/// <reference path="/path/to/jquery-1.3.1.js" />
Ensure that you maintain the -vsdocs on the intellisense file and it will be automatically picked up (as long as it's in the same folder as the file you reference)
The accepted answer helped me fix this issue but didn't resolve the problem. I installed the hotfix: http://code.msdn.microsoft.com/KB958502 but was still receiving an error.
Error:
Error updating JScript IntelliSense: D:\Dev\Test\Scripts\jQuery-1.3.2-vsdoc.js: 'jQuery.support.htmlSerialize' is null or not an object # 1430:4
It appears the addition of the follwing file without the appropriate -vsdoc.js file causes the above issue.
<script src="../../Scripts/jquery-ui-1.7.custom.min.js" type="text/javascript"></script>
I added an empty file "jquery-ui-1.7.custom.min-vsdoc.js" to my scripts folder and the Jscript Intellisense issue went away.
I'd like to present a slightly better solution. A few months ago I tackled this problem and created a very basic vsdoc file for jQuery UI. Here's the link to the blog post (which has the file for download).
I solved this per the advice above with a minor extension: the trick for me was to add a reference on my page to both my jqueryui.com library AND to the blank -vsdoc.js version of the file I created:
<script type="text/javascript" src="../../Scripts/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui-1.7.2.custom.min-vsdoc.js"></script>
Hope this helps!
Great, the tweak is by creating an empty *-vsdoc.js file for each troublesome *.js files.
I found this error caused by anonymous function e.g. like this:
(function($) {
$.anything...;
})(jQuery);
Hope this caused will help somebody creating the http://code.msdn.microsoft.com/KB958502 and JScript IntelliSense Team.

Categories