Develop Reference

Why is jQuery document ready closing off access to global variable?

I have a project where I have three separate JavaScript files (example1.js, example2.js and example3.js lets call them) scripted into one html file (index.html). These three JS files between them are responsible for an API call and manipulating the result.
One of the JS files, example1.js refers to a global variable located in example2.js and as they were both loading into the same html document I thought the access to said variable wouldn't be an issue and it did indeed work perfectly fine until I added the files to my RoR app. Due to Rails I had to encase the JS/jQuery code inside of $document.ready(function(){}
(I should probably should do this as a matter of course anyway?).
The effect this has had is that I am now getting a 'variable not defined' error on the global variable referred to by example1.js that is located in example2.js, even though other code in the same file is working correctly.
I went back to my original JS files away from RoR incase it was a Rails issue. However, encasing the code in my original files with the jQuery document.ready function has the same effect outside of the Rails environment. Can someone explain why this is and a possible solution?

I completely overlooked the fact that document.ready is itself a function and therefore removed everything from the global scope into the function scope of document.ready.

How to access environment variable from rails on your javascript?

I am trying to set up a key system in the application I'm building. I have a code that has this logic:
$('.key-test-button').on('click', function(){
if ($('.key-test-input').val() === "MYKEYHERE"){
$('#hidden-div-instructor').show();
}
});
And My Idea was to replace "MYKEYHERE" for a hidden value on my code that I would store as a environment variable. I know how to do that for APIs for example, inside rails, but Im not familiar how I could access this variable inside my javascript/jquery script. I would love if someone could give me a insight. Thanks you.

As #davidhoelzer mentioned, you can't do this with pure js (as far as I know)... you could, however, change the .js file to .js.erb and use ruby to access/manipulate your environment variable that way.

Using gsp layout declared variable in javaScript file that is being loaded in the same page

I recently started learning grails and I am trying to use a gsp variable declared in the layout of the page as:
<g:set var="abtestType" value="newSearchBar" />
in the js file that is being loaded on the same page. Things that I have tried:
alert(${abtestType});
alert(<%=abtestType%>);
alert("abtestType:"+abtestType);
but its showing error as variable is not defined. Probably I am trying to fetch it in wrong way, need help regarding this.

Even thinking about doing so neither makes sense nor applicable.
Reason for such statement is that when a gsp page is rendered to an html page, it replace grails tags with appropriate html tags or value. Similarly it replaces the ${} or <%%> with html or javascript or whatever that goes on front-end.
Hence the code that you have tried could have worked fine if you were having those javascript code lines in the gsp itself but as you have called externalised js file it actually don't know anything about gsp or jsp or any other Language's front-end support.
The one way of doing that if using global variable in javascript. e.g.
declare abtestType above like below:
<script>
var abtestType = "${abtestType}"
</script>
Now you have access to global variable abtestType in your javascript.
Use it in your javascript but remember now you need to have this variable iff the code using it is called otherwise very same error would you get i.e. variable is not defined
There is another way that I found in this post but is a manipulation actually.
Is there any analogue in Javascript to the __FILE__ variable in PHP?
Also, another good links is
Pass vars to JavaScript via the SRC attribute
Hope it helps!

How to read model attribute from js outside jsp

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.

Getting data into js program through parameter or by reading Joomla URL of calling page

This seems a dumb question but as a new JS programmer I can't find a way to do this. I can pass parameters to functions but cannot see how to pass a parameter to a program.
I have a JS program called from within a Joomla module. The program uses AJAX to get data from an XML file, manipulate it and then output it to HTML through a jQuery call of:
jQuery('#eventsContent').append(htmlEvents.join(''));`
where, in the HTML I have: "
<div id="eventsContent"></div>
Depending on what page I am on in a Joomla module (or which module I am calling the program from), I want to set a variable within the JS program which tell me how to filter the data. My reference, within the module to the program is simply in the program declaration of:
<script type="text/javascript" src="program_name.js"></script>
Is there some way I can append my parameter there and then access it in the program?
Even better yet for me as it would then be a single module, is there a way the program can read the current page from the URL. From it, I could derive the variable value.
Can this be done one way or another?