NetBeans: Javascript Code Completion doesn't work as expected - javascript

I've just started using NetBeans (PHP version 7.2 for Mac) and love it so far. One thing that I haven't been able to figure out is how to get Code Completion to work for Javascript files in the same fashion as it does for PHP, CSS and HTML files. For example, if I type "fun" in a PHP file, it'll pop up a box that allows me to choose "function":
If I do the same thing in a Javascript file, I get nada:
I've looked all over the place and I have not found a way to add this functionality. Your help would be greatly appreciated.

For this example, try the Source-> Complete Code command (Ctrl+Space by default).
In any case, the JavaScript editor is currently being rewritten from scratch so better code intelligence is to be expected in the near future.
Edit: I almost forget the most obvious answer... Make sure your file belongs to a loaded project. Code intelligence doesn't work properly outside projects.

Related

Running Javascript in visual studio code

I started learning coding in javascript. Wanted to practise my skills using visual studio code but I cannot run the code (to test if it works). Ive spent many hours browsing google to find the setting, but so far I got to this jsconfig.json thing, placed it in my folder where other .js files are, but the .js file with my practice code still doesnt run. I right click in the field with javascript code, press run the code and it still doesnt run. I guess I am still missing something.
Would you be so kind to please advice me step by step what to do?enter image description here

Debugging Javascript inside php file possible?

I am trying to find the way to debug javascript code inside the php file. I have a lot of javascript code embedded inside the php file.
I can debug php code using netbeans with the help of XDebug. I can also debug javascript separately inside html or js file with browser like chrome or firefox.
What I want is to debug javascript code inside the php file if it is possible. I am sure a lot of people will be using javascript embedded with php file. I don't like it personally, but I have to work it on. I know I can write the code separately in js file and then can debug with browsers, but it's lot of code, take time for the separation.
Can anybody here suggest me a way if it's possible what I am asking.
Debug Javascript in netbeans 7.4 inside PHP project
https://netbeans.org/kb/docs/php/debugging.html
https://confluence.jetbrains.com/display/PhpStorm/Debugging+PHP+and+JavaScript+code+at+the+same+time+in+PhpStorm
https://blog.jetbrains.com/phpstorm/2014/06/debugging-php-and-javascript-code-at-the-same-time/
IMHO, without even looking it up, i don't think that it is (nor should) be feasible.
Here's why:
Your PHP gets processed on the server side, that's when XDebug kicks in and enables you to breakpoint all your PHP code. Then the server output gets to the client, that's when the actual JS is processed inline in the parsed HTML. Which means you would have to intercept the HTML in some way, parse it, detect eventual inlined JS scripts... and set your breakpoint(s) at that time (yes on each run), then output to client, which parses the HTML yet again to render it and process eventual breakpoints. It would be a tedious process and even more tedious to get to work i guess and that is why nobody even tried making an extension for that.
To my knowledge, inlined JS is also a lot harder to debug and i never saw an actual setup that would allow breakpointing embedded tags in a static HTML document directly from the IDE, which would've been somewhat a little easier to achieve than breakpointing JS in PHP...
Your best shot i guess would be to externalise your JS in separate files and only hard code <script src="path/to/your/app.js"></script> in your PHP templates, which indeed would be much more comfortable to work with on the long run anyways.
Then you would be able to breakpoint all the stuff in app.js, plus have an actual front-end architecture, syntax-highlighting, impress your boss, make your life a lot easier, the world a better place, etc.
Also, for reference: How to debug JavaScript code with Netbeans? (answer #45515159)
And read on: https://netbeans.org/kb/docs/webclient/html5-js-support.html
Edit: seems like setting JS breakpoints in static HTML tags is feasible in Visual Code for example -> https://github.com/Microsoft/vscode-chrome-debug/issues/122
I don't know if I am late, but, I came across the following website and was able to setup the debugger for Javascript and PHP which supports to debug embedded JavaScript in PHP scripts.
source: https://abcmemo.com/2017/04/20/debug-php-and-javascript-in-visual-studio-code/
The website uses PHP.exe as a web service.
It is also possible to use IIS, Apache or others.
Requirements:
IDE: Visual studio code
Extension: PHP debug
Extension: Debugger for (Chrome, Firefox or Edge)
Xdebug set in php.ini
Extension in browser (optional): PHP xdebug if you want to debug on trigger.
You need to have two debuggers running at the same time one for PHP and one for JavaScrpit.
PHP sample
JavaScript sample
I worked with a lot of wordpress templates where I had to deal with some js inside my php files. Assuming that you can run your code on a server, you can easily debug your output in dev tools in chrome (if using chrome). Chrome also allows for setting of breakpoints so you can go line by line, and since your browser ultimately runs the js, you can monitor your code behavior without dealing with the php. That was my main way of dealing with this issue.
I also recommend separating as much js as possible into separate files in your assets folder. Depending on your project, you rarely have to inline your code, In my opinion it's messy to include a lot of JS right in your php, unless you use onclick="" or onchange="" attributes (which can also be handled with event listeners.
Aside from that, console.log() the crap out of everything.
I helped my self with the following steps if it could help any body else
Note:- If your rendered code is inline specific to java-script then it would hard to debug like this.
Run the required page of your application using browser like chrome, edge etc
Open the inspection page by pressing f12 or (Ctrl+Shift+I), Or you can right click on the page see the option for the inspection and click on it.
Goto sources and double click on the source file(this will be probably your php file).
If code not loaded then reload the page by pressing f5 or Ctrl+R, you will see your java-script code there embedded with the html after rendering, then you can put the break point wherever you want and debug through the browser tools(you can see some buttons there to guide you about debugging like step-over,step-into etc).
You will also see errors there regarding java-script,

Need help p5.js and Atom Text Editor

Well I recently started off with atom and p5.js well I am very new to JavaScript. Here comes my problem : When I try to run the file it shows me "sketch.js is not a .py file, exit" . I checked the the selection is set to JavaScript but can't figure out what is wrong.. Please Help !
Well the "sketch.js" is the default one which comes with "p5.js" and yes I have installed "node.js" so no issues with that and the problem comes when I edit the "Sketch.js" template and try to run it , it shows saving and after that it says "sketch.js is not a .py file, exit"
You need to isolate your problem. Is the problem in the Atom editor, or is it with P5.js?
Try running your sketch as a standalone .html file that you create with a basic text editor (like JEdit or Notepad, not with Atom). Can you get that working by itself?
Then try running a more basic JavaScript application in Atom. Try simply printing something to the console. If you're still getting the error, then you know it has nothing to do with P5.js.
Isolating your problem like this will help you refine your Google searches, and it will make it easier for people to help you.
Note that P5.js does not require node.js, which runs on a server. It requires regular client-side JavaScript.
I'll also just note that if you're having trouble with stuff like this, it's a good idea to stick with a basic text editor and write and run your code by hand for a while. Code editors hide a lot from you, which can be nice, but not if you're still learning the fundamentals.
You are likely using an editor like Genie or something which runs python programs by default. Have you installed node.js? If not install it and then browse to the directory using command prompt. Then run "C:\Program Files\nodejs\node.exe" file.js

Difficult to read source code for some web pages?

I have been trying to find an explanation for this, but everywhere I looked doesn't seem to answer my question. Essentially, whenever I look at the "view page source" option on a webpage like Facebook or my school's home page (gvsu.edu), the source code is just a huge wall of text. As a result, I have a few questions:
Is this how it looks in the editor? If not, why is it formatted this way when I look at the source code?
Is there any way to decipher this code so I can see how it works?
Are there any advantages to formatting the code this way?
Thanks.
Is this how it looks in the editor? If not, why is it formatted this way when I look at the source code?
no, usually programmers try to make code as readable as they can, this is a "minified" version of the code, it's done to make files smaller so people can receive it faster in their browsers.
Is there any way to decipher this code so I can see how it works?
you can use some online tool to like this, you will have to format html, css and javascript individually.
Are there any advantages to formatting the code this way?
already answered, but here I can add that usually you don't format the html/css/js that way, you have a tool that does that job for you like gulp-htmlmin, gulp uglify, cssmin or many others, and you work with a "development" version of the files, when you are done editing you run some scripts and they spit that minified version to you, so you can upload it to your server.

Javascript stopped working after combination

Well I had lots of scripts so what I did is that I combined all of them into one script file, which contains files like Jquery library too.
But now the problem is that it has stopped working, I don't know why did this happen.
What I did is that I took every script copied and pasted it and then I gave some space under it by pressing enter a few times and then I used to paste other script, I was told this was the method to combine scripts but now the scripts don't work.
Here is the link to combined scripts http://files.cryoffalcon.com/bloghuts/uncompressed/BlogHuts%20UNCOMPRESSED.js
And the link to a live example is http://bloghutsbeta.blogspot.com/
ANSWER/SOLUTION:
Earlier I was using an older version of Jquery I think 1.5 now I changed it to latest 1.7 and that was the reason that everything stopped working. It had nothing to do with combination. I am using all scripts combined and everything is working fine But why is older version better than New that is a new question for me
First, I'd suggest you move the jquery library links out to the main page. Have one file for all of your javascript, and include the other stuff on separate lines.
Whether or not you do that, though, your problem is almost certainly some sort of unclosed bracket or semicolon missing or something similar. Javascript often reacts to stuf like that by throwing its hands up in the air and giving up. The way to fix it is to go through your file and pick a function that is not currently working, but that is easy to test for functionality. Then comment out everything else, and test to see if the function works. If not, fix the function until it does work. Then, one piece at a time, uncomment each of the other blocks, again testing to see if the initial function works. If uncommenting a block causes the thing to stop working, then that's the block that you need to fix. Depending on how long your blocks are, you may need to do this in tiers
First, don't do that with jQuery, ever. You're almost always better off pointing your script src to a public CDN somewhere.
Second, what you're trying to do is very brittle, and probably not worth troubleshooting. If you have that many JS files, you really need to use a module library (I like require.js) to give your project some structure and make it more manageable. Most libraries like this will include some sort of utility to combine and minifi your scripts safely.
This will take some work on your part to get things setup, but it should prove well worth it in the long run!

Categories

Resources