How can I add automatic language injection for PHP into JavaScript files?
When I add some PHP code into JavaScript the whole syntax highlighting messes up and I got a ton of errors.
I tried to add language injection with ALT+ENTER but I don't get PHP in my list of injections:
This won't work. The reason that it cannot be done is that when you load the javascript file in your browser, the PHP code will just appear as plain text, rather than actually be ran to produce the result that you want.
Just to reiterate, you cannot inject PHP code into Javascript files, what you can do however, is have inline javascript, within a file that can handle PHP. For example, if you want the variable contents, you'd have your JS file like follows:
$(function() {
loadSomething(varNameHere);
});
Then somewhere in the main body of the main, file somewhere that PHP can be ran, you can have this.
?>
<script> var varNameHere = "<?=$somePhp;?>"; </script>
<?php
While not ideal, this is a base example of how it'd work. Hope that helped.
Related
I recently tried including JavaScript using PHP as such:
<?php include 'iife.SomeFile.js';?>
I did not expect it to work, b.c. I thought it would try to interpret the JS as PHP, but instead it just included the file as I asked it.
Is it b.c. I simply omitted the <?php tag that it chose to output the file as text.
Makes me wonder if I can include pretty much any type of file I want.
Also, makes the purpose of SSI seem redundant.
Because this is a valid PHP file:
<html>
...
<script>
var foo = 'bar';
</script>
You may notice that there's no PHP at all in this file, yet it's still valid. That's because PHP was designed as an embedded language to be used in HTML, delimited by the <?php ?> tags. PHP passes anything that's not in those tags through as is.
Also, makes the purpose of SSI seem redundant.
The existence of one language does not make another redundant. Many languages overlap with many other languages in what they can do. Doesn't mean we should all be using just one language. For one, SSI is a lot more lightweight than a full-blown PHP instance if all you want is to include a file.
PHP includes work the same way includes for languages such as C. They simply include or insert the file at that point.
It's just like typing in that entire file yourself where you put the include.
PHP code is executed on the server side. JavaScript is executed on the client side (except with node.js)
The include statement is used to include PHP code. You can use it to include a php lib file in your code.
I have some html, that had a bunch of JS code inside a script tag. So I moved it to a separate .js file.
JS code also loaded some variables from CGI, using strings in a form of <%ejGet(var)%>. But after separating the code from HTML file, the strings don't get replaced with data from the server.
Is there a way to include a JS file as if it was written inside a script tag or is there another way to do this?
<script language="javascript">
<!-- hide
var syncNvram = '<%ejGetWl(wlSyncNvram)%>';
...about 1000 lines more...
</script>
So after moving this code to a separate file, the variables don't load.
The problem is that your <% ejGetWl(wlSyncNvram) %> is being executed on the server by some templating or processing engine before it gets sent to the browser, so the browser is actually seeing the output, e.g.
var syncNvram = 'abcdefg'; // or whatever the output is
The question you are really asking is, can my server side templating/processing engine process a javascript file as opposed to an html file.
The answer is, it depends on the template/processing engine, but in general, this is a bad idea. JS files should remain static assets for lots of good reasons (breaking code, distributing via CDNs, etc.)
The better thing to do is separate them out:
<script>var syncNvram = '<%ejGetWl(wlSyncNvram)%>';</script>
<script src="myfile.js"></script>
Declare it separately.
Even better might be using ajax to get it, but that is a whole different architecture which may not suit here.
To do that you need to generate the script from the CGI program.
<script src="/cgi-bin/example.js.cgi"></script>
Of course, that will be a different CGI program so getting the variables in the right state may be problematic.
Usually you would solve the problem using a different approach: include the data in the document (either in the script element or in an element such as a <meta> element, a hidden input or a data-* attribute on something relevant and then have a static script read the data from the DOM.
If my javascript/jquery code is written inside a jsp-file, I can refer to Spring's modelAttribute value with "${varName}".
However I would like to move the javascript code into it's own file to keep the jsp-file more readable. When I do that, it won't however be able to find that modelAttribute anymore. How should I solve this problem?
How can I point to model attribute from a .js -file?
Thanks in advance!
Alright, I've experimented on my end to try to find and answer for this question.
Actually, it seems there's no direct solution, and here's why:
When you are moving your Javascript code to a separate file, this means that the browser will launch a separate request to fetch that file. As such, data that you store in your request scope (a.k.a. ${varName}) is not part of the request that fetches the .js file; it's only part of the request that fetches your .jsp file instead. As such, the ${varName} value will not be available in your Javascript file.
Another reason on top of the above: .js files are not processed as server-side code by the web engine (most likely Tomcat in this case), so the ${varName} text is outright ignored. For fun, I tried to do a hack: I renamed my script file from .js to .jsp, and used this within my .jsp page:
<script type="text/javascript" src="js/actually_javascript.jsp"></script>
It fooled the web server to process the file server-side, but this still didn't work, because of reason #1 stated above. It could work if you stored the value in the session instead, but at the end of the day, it would be kind of an ugly hack and you'd lose out on the code highlighting and completion features of your IDE, which would be fooled into thinking you're editing an actual .jsp file. Not recommended.
To conclude, I think the only way to access {$varName} inside your JavaScript is either:
Having the Javascript being a part of your .jsp file, within <script> tags
Having your Javascript in its own .js file, but still having a <script> tag in your .jsp page which initializes the module you programmed in the .js file and passes the values from the request, like ${varName}
You should initialize your javascript file via your jsp file.
Example:
Create a seperate script section for initialization of your variables after loading the .js file in your jsp page:
<script src="js-path/file.js"></script>
<script>
init(${varFromModel1}, ...);
</script>
And define the init-method in your javascript file:
function init(param1, ...) {
// initialize variables of .js file here
}
Remember, for this to work, you need to ensure, that the model-attribute output has correct javascript syntax.
I am using Knockoutjs in my asp.net MVC-5 application. I have the following javascript in view:
<script type="text/javascript">
var model = "#Html.Raw(Json.Encode(Model))";
$.get("#Url.Action("_CityPartial")" ...)
//any much more code using similar Html helpers + pure javacsript code.
</script>
Now i want to know, is there any way to transfer this javascript code in a separate js file (keeping Html helpers as it is).
I want to transfer javascript code to separate file because i dont want any user to check my javascript code (using chrome inspect element or any other way).
If the transfer is not possible than please let me know if there is a any way to minifiy the javascript in view itself ??
You could create an external .js file with your code in and pass your serialized json object to it like this:
<script type="text/javascript">
var model = #Html.Raw(Json.Encode(Model));
DoThis(model);
</script>
This has the benefits of keeping the main body of javascript in a separate file.
Any other razor variables can be passed across to the methods defined in the javascript in the same manor as the model has been above.
However as Stanyer mentions this is still javascript and it will run on the client.
You can load it via an external JavaScript file, but unfortunately as JavaScript is a client-side scripting language regardless of whether its loaded inline or externally, the client can still view the code which is being executed on their browser.
You mention minifying - again this can still be interpreted by a client if they really wanted to see your code, but there are many tools online which can minify your JavaScript for you.
Examples:
http://jscompress.com/
http://www.jsmini.com/
No you cant keep the #Html helpers in external javascript file. They are all server side syntax and will be rendered in your HTML page inline.
What maximum you can do is, assign it in a var variable in your page and refer it inside a external page.
Background information :
A tool simulates IE behavior, instead of HTML for browser, it uses a special object which contains html segment<![CDATA[ HTML Here or JS here ]]>. The tool disabled the ajax call; however, the activeX works on that tool. In other words, HTML display in browser = special object display. No server side language (i.e. php) allowed.
Problem :
The object developed for that tool contains everything(html+css+js) in one single file. Then it makes developer difficult to manage changes. Currently, when I develop, I copied the HTML from <![CDATA[ All HTML or JS here ]]>; after I modified it , I copied the html file back to <![CDATA[ HTML Here or JS here ]]>. I want the object is more organized, for example: in the html segment of the object, just put something like <![CDATA[<javascript>require a.html<javascript> ]]> , then the content in a.html will be automatically placed in the object. Can you suggest any solution or any library for this problem?
ps: I didn't use requirejs before, it seems requirejs uses ajax call to include text file, is it possible that requirejs uses local path to include a file?
Thank you.
Partial solution to my problem: I used activeX to read the entire file, and used jQuery to set the file content to some html element. so the js will look like:
<![CDATA[
<script>var k = readfile(getAbsolutePath()+"\\a.html");
jQuery("#display").html(k);<script> ]]>
I think this solution is for my tool only; To make it work, some requirements:
1. can get the absolute path of the text/html file.
2. activeX works.
OK, now that I understood your problem.
Use
<iframe src="another_file.html">
That is probably the only way to load multiple html files without Ajax or PHP, as far as I know.
Per comment from prytsh, using an embed call should do the trick in HTML5:
You can try this by using jquery
//use this line in jquery
$("#id").load("trackingCode.html");