How to access environment variable from rails on your javascript? - 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.

Related

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 get requestscope variable in external javascript

I have some problem regarding request scope variables in spring application. Problem is I have an Object "xyz" which was added to reference data map in SimpleFormController. Now I want to get this object(xyz) from java script. This is done in internal javascript as '${xyz}', but I need to get this from external javascript file. please any one help me out. I know external java script file not come under request scope, But is there any possible solution?
thanks in advance,
The answer is, declare the script variable at global level. Now that variable can have the scope to external scripts files also.

Passing data from my razor view to my js file

I'm searching for the best way to pass data from my razor view to my js file. For example, lets say we have a jquery dialog configured in the js file. For buttons text on this dialog, I would like to localize it (through resource files FR/NL/UK). The translations are available with #UserResource.ButtonDelete + #UserResource.ButtonCancel
Below are the different solutions I see:
Using the nice RazorJS nuget package to allows razor code inside my javascript file. It works pretty well. But the question is: is it a bad practice to compile js files in order to use razor syntax inside the scripts?
Declaring global variables in the js script file and assign value from the view like this:
In the view:
<script>
var labelButtonDelete = #UserResource.ButtonDelete;
</script>
In the js file:
alert('The text for my button is ' + labelButtonDelete);
What is the best way to pass data from razor to js file? Do you have another alternative?
Thanks anyway.
I've been using something like your second approach for some time without any issues. The only difference is that I'm using a singleton in my JS file to avoid polluting the global javascript namespace.
But if you will be doing more serious client side stuff, your Javascript code will follow a more object oriented structure, and from there you almost automatically get a single initialization/constructor path where you can pass your localized values.
That RazorJS looks nice, but I'm not sure if I'm comfortable mixing Javascript with Razor. Might do it for a small project, but I can see it becoming really messy if you have lots of Javascript files.
After all, I still consider the resources/localization code to be related to the view. The Javascript should only implement functionality in my opinion.

What is the most efficient and robust way to program ASP.NET with javascript?

I wanted to know what is the best approach to program ASP.NET with JS?
So far, I've been trying to code with the Codebehind attributes.add("onclick," ....");
is there a better more efficient way to use JS with ASP.NET?
thanks
writing all your function in a separate js file is far more flexible that what you are doing now. The problem might be getting the control ID's in your js file.
Well there are many methods.
Hardcoding
Just view the source and figure out the ID of the control which you want to use.
this is easy but if you you may want to change the ID of the control at some point of time the respective functions will not work
Something like This
Declare a variable with all the the ClientIDs in the aspx file use it in the js file
var MyControlIDs = {"Textbox1":"<%= Textbox1.ClientID %>","Label1":"<%= Label1.ClentID %>"};
and in your js file var mycontrol= window.MyControlIDs
and use it wherever you want
var textbox = document.getElementById(mycontrol.TextBox1);
Many WebControls have an OnClientClick property, which is equivalent of what you're doing. Also you can always set it in your markup for controls that don't have the property.

Localization Helper, How to retrieve values from javascript?

I used localization helper from Matt Hawley. It's really working great. I have a problem though in getting the values on javascripts/jquery.
I can't retrieve the resources text using this:
example: alert('<%=Html.Resource(\"Strings,SomeKey\")%>');
Any help is greatly appreciated.
Best
Thank you BalusC for the reply. Greatly appreciated. I already got a work around. I declared variable on my .aspx page with the resources key values. Then call the variable on my separate js. So I have it like this:
In my aspx page.
<script>
var foo="<%=Html.Resource("Strings,SomeKey")%>";
</script>
In my js. I just simply called the variable foo.
alert(foo);
There I have it!:)
I got it wrong for the first time since my variable was declared on my external js. Therefore asp.net will not be able to interpret it. Instead it will be rendered as plain text.
Best regards

Categories

Resources