how to access variable in javascript - javascript

I'm using javascript in my html page.
I've defined a variable 'language' in html:
<c:set var="language" value="${not empty param.language ? param.language : not empty language ? language : pageContext.request.locale}" scope="session" />
and I would like to use/modify this variable from javascript.
function changeLanguage(name) {
language = "fr";
}
how can I do it ?
What I have tried
I have a picture in html page and after clicking on it I call this js function. when it's called, variable 'language' should be changed to 'fr' . Maybe it can be done easier. I dont know.

Here JSTL code is executed at server side and the server sees the JavaScript/Html codes as simple texts. The generated contents from JSTL code (if any) will be rendered in the resulting HTML along with your other JavaScript/HTML codes. Now the browser renders HTML along with executing the Javascript codes. Now remember there is no JSTL code available for the browser.
So you cant use javascript to change value.

Change attributes(var) value(language) using JavaScript
Place this in your HTML Page
HTML
<c:set id="lang" var="language" scope="session" value="...." scope="...." />
<img src="abc.png" onclick="changelang()" />
<script>
$(document).ready(function(){
function changelang(){
$("#lang").attr("var", "fr");
}
});
</script>
Credit:
http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_dom_attr_set

Related

Passing HTML value to embedded script

So I have a HTML file with an embedded script. A Java application sends a value to this HTML file. Now I wonder how to pass this value from the HTML down to the script. Is this even possible?
Here is the simplified HTML file with my approach:
<html>
<body>
<div id="test">
[VALUE_FROM_BACKEND] // prints "let valueFromBackend = 1234"
</div>
<script>
console.log(document.getElementById('test').value);
// should return: let valueFromBackend = 1234;
// actually returns: undefined
</script>
</body>
</html>
Unfortunately, I can't pass the value from the Java application directly to the script. I got the above approach from here, but this doesn't work.
Other solutions only focus on getting values from remote HTML pages, declaring the HTML files's source in the script tag. But since it is an embedded script here, this also seems not to work.
Does anyone know how to deal with the situation? Help will be much appreciated.
Only HTML input elements have a value in javascript. A div cannot have a value, which is why your code returns undefined.
To access the text inside a regular HTML element, such as a div, use element.innerText instead.
Here is a working code snippet you can try out:
console.log(document.getElementById('test').innerText);
<div id="test">
let valueFromBackend = 1234
</div>
As you want to get value of a div element, so the syntax is:
document.getElementById('test').innerHTML
Remember that getElementById().value works for input and use getElementById().innerHTML for elements like div

Passing/exposing VXML Application root document variables to JSP

I need to have variables that are defined in my VXML application root document, which other documents modify, available to the JSP/EL pages. The idea here is that based on the value of these variable I can add logic to the JSP to render different blocks of VXML back to the IVR browser.
What I have tried so far does not generate any errors. It simply does not render the expected block of VXML code within the EL. My guess is that I am not de-referencing them correctly in EL.
Below is some of what I have tried.
root.vxml doc has
..
<var name="promptRetries" expr="''" />
...
start.jsp:
<vxml version="2.1" xmlns="http://www.w3.org/2001/vxml" application="/root.vxml" >
....
<assign name="application.promptRetries" expr="'3'" />
.....
<block>
<submit next="${pageContext.request.contextPath}/nextdoc.jsp" />
</block>
nextdoc.jsp
<vxml version="2.1" xmlns="http://www.w3.org/2001/vxml" application="/root.xml" >
....
<!-- at this point I can print and see the value of 3 for promptRetries -->
<!-- How can I expose this to JSP to accomplish something like the code below
I have used .equals() and other forms in the EL expression with no luck.
-->
<c:if test="${(application.promptRetries eq 1)} ">
<!-- Setting prompts for 1 retry -->
<catch event="noinput undefined" count="1" >
<audio expr="curPrompt2"/>
<log expr="buildLogStr(ibmCallId, documentName,frmName ,blkName,
'event=noinput count=1 reprompt', '')" />
</catch>
</c:if>
...
....
When developing VoiceXML applications in JSP, you need to be aware that there are two execution spaces. First, the Java server that generates the VoiceXML. Second, the VoiceXML Browser that executes it.
You already have an example of passing data from JSP to VoiceXML with the ${variable_name} syntax. To pass data from VoiceXML to JSP, you need to explicitly list the variables to send in the submit element:
<submit next="${pageContext.request.contextPath}/nextdoc.jsp" namelist="promptRetries"/>
And then in your second JSP page, use
request.getParameter("promptRetries")
to access the variable sent from the browser.

Grails <g:set tag in javascript

how to set grails variable in javascript?
I also tried
<a onclick="myFunction(${aCase.id})" .../>
...
<script>
function myFunction(id) {
<g:set var="caseId" value="id"/>
}
</script>
value of caseId always 'id' (string), i want it value of 'aCase.id'
thanks!
(sorry, i not good at english)
You can not set a gsp var with javascript. Cause the gsp var is set before the gsp is rendered on server side, and the javascript runs on client side.
<script>caseId = ${id}</script>

Interpret variable in Javascript file Laravel

I need to include a js file in my views.
But in this js file i need to interpret somes PHP variable.
Actually i do this :
#section('javascript')
<script>
alert("{{{test}}}");
</script>
#stop
But i REALLY need to do this :
#section('javascript')
{!! Html::script('js/test.js') !!}
#stop
test.js :
alert("{{{test}}}");
I need to declare a lot o variable. So my JS file will be very huge. And i don't want to show this directly in the source code.
How can i do ?
Thank you !
You can only pass the variable to the javascript like so:
#section('javascript')
<script>
var test = {{{$test}}};
</script>
#stop
then in your javascript file included at the bottom you can use it:
alert(test);
Let me just mention that this is not a great way of handling the passing variables from php to javascript.
When I need to do something like this, I usually create a meta tag on the page which would contain the alert information.
<meta name="someAlertValue" content="{{{ $test }}}" />
Then you can very easily grab that via jQuery.
var alert_text = $('meta[name=someAlertValue]').attr('content');
I find this approach to be much cleaner and maintainable than trying to drop php variables directly into your javascript.
I had the same problem, and wanted to have a stand alone js which will have bunch of variables taken from config() or even from database, multi-language, and will be configurable, or even will work with query parameters.
Maybe it's a hard way, but i've created a route:
Route::get('/js-modules/test.js',function(){ return view('js-modules.test');})->name('my_js);
So in the view resources/views/js-modules/test.blade.php you can put your js code together with your PHP stuff.
Or you can route it to a controller and have even more background work. it looks a bit slow (in the browser) on the first run , but second request it'll be cashed and retrieved as the regular js file
And now you can link it to any of your pages with
<script src="{{route('my_js')}}"></script>

Setting the "pattern" attribute of <fmt:formatDate> tag with Javascript function

I'm brand new to web programming, so this is probably a dumb question. Here's a snippet from a JSP page:
<c:choose>
<c:when test="${ empty model.toThemAssoc }">
Not setup to send
</c:when>
<c:otherwise>
Connected since <fmt:formatDate value="${ model.toThemAssoc.dateEntered }"/>
</c:otherwise>
</c:choose>
I want to set the pattern attribute of the fmt:formatDate tag to a string I can retrieve from a cookie in JavaScript like this:
function getDateFormat {
return $.cookies.get('dateFormat');
}
Although the below code doesn't work, it represents what I'm looking for:
<fmt:formatDate pattern="getDateFormat()" value="${ model.toThemAssoc.dateEntered }"/>
Any suggestions? Thanks in advance.
This will not work the way you expect. The <fmt:formatDate> tag is processed and executed before the HTML content even gets to your browser.
If you have information on the client-side that is required to format data from the server-side before it gets to the client-side, you will have to do it via AJAX or something similar. Essentially you will have to send that date format from the cookie into your controller. Your controller can then format the date as it sees fit, or pass it into the view via the model, in which case you can access it using EL for the <fmt:formatDate> tag.

Categories

Resources