How to access clicked variable in linkClicked function in Navbar.tsx file? - javascript

How to access clicked variable in linkClicked function in Navbar.tsx file from Home.tsx file to check IF?

try this onClick={()=>linkClicked(Link)}
the function linkClicked accept a string value so you have to pass a string

Related

Javascript function file parameter

I'm trying to write a JS function that gets always the same file as parameter, like this:
function something(../content/id.csv){
//do something with this file
}
Is there a way to do it, without <file> input HTML tags?
Thanks for your help!
(Suggestion) Remove that param and use a local variable within that function.
But, if you want to call the function as follow something() and always will be that way, you can do this:
function something(path = '../content/id.csv'){
console.log(path);
}
something();
Resource
Default parameters

pass variable to new HTML with window.open

Im opening html file from js function:
function initCategoryPage(url){
var catUrl=url;
window.open("category.html");
}
I putted this script in "category.html" but it doesnt get the var catUrl:
<script>
myUrl = window.opener.catUrl;
alert(myUrl)
id=1;
firstTime=true;
ArticlesBlock();
</script>
how can I pass it to category.html?
The reason it can not read it is because the variable is not global. The scope is limited to that method.
function initCategoryPage(url){
window.catUrl=url; /*make it global*/
window.open("category.html");
}
A better solution would be to pass it as a querystring or use postMessage to get the value.

Retrieving Variable From A Javascript File

My question is how to share a variable between two different javascript files. I am creating a form that transfers the value to a different page, which alerts that variable. I have 2 html files (index.html and form.html) as well as 2 javascript files (form.js and index.js). So basicly I want to share the variable theNick from form.js to index.js to display it using alert(). If this is not possible, is there another way to do this?
form.html:
<input type="text" id="Nick" placeholder="Nickname">
<a id="btn" onclick="submit()" href="index.html.">Submit</a>
form.js:
function submit(){
var theNick = document.getElementById("Nick").value; //retrieves theNick from your input
???
}
index.html:
<button onclick="callNick()">Click Me to view your Nickname.</button>
index.js:
function callNick(){
???????
alert(theNick); //I want to get access to this variable from form.js
}
By using the var keyword you are doing exactly the opposite. If you want to share something the easiest thing would be to bind the variable to the window object like this: window.theNick = ... and use it like alert(window.theNick).
It is sort of possible.
First of all you need to make certain that your HTML loads both JavaScript files. There isn't really a way for them to import each other, so the HTML must load both scripts.
Secondly, you need to modify your function submit to use a global variable. Global variables are initially defined outside the scope of a function. The function callNick is already looking for a global variable.
However, the submit function is defining its own, local variable because of the keyword var being used inside the function scope. Change it like so:
// Set global variable
var theNick;
function submit(){
// Use global variable
theNick = document.getElementById("Nick").value; //retrieves theNick from your input
???
}
See this article for further information.
http://www.w3schools.com/js/js_scope.asp
You could just declare the variable outside of the function
var theNick; // you could omit this entirely since it will be declared in
// global scope implicitly when you try to assign it in the function
function submit(){
theNick = document.getElementById("Nick").value; //retrieves theNick from your input
}
javascript does not care about which files declarations are made but in which scope.
By placing the variable in global scope you'll be able to access it everywhere.
Global variables are not the best coding strategy but this should help you with the concept
It seems like you need to store the variable in the local storage object of the window object, this way you can set its value on the first page and retrieve it on the second.
page 1
window.localStorage.setItem("yourVariable", "yourValue");
page 2
var myVar = localStorage.getItem("yourVariable");
Only one 'caveat': this is a html5 feature, so it comes with limitations, check this link for more info.
You can pass your variable into the url, using the ?yourVar= GET mark :
form.js
function submit(e){
var theNick = document.getElementById("Nick").value; //retrieves theNick
e.target.href+='?n='+theNick; // set the href of your anchor with your variable
}
form.html
<input type="text" id="Nick" placeholder="Nickname">
<!-- We pass the event object into our function as a parameter -->
<a id="btn" onclick="submit(event)" href="index.html">Submit</a>
index.js
function callNick(){
// get the variable from the current location
var theNick = window.location.href.split('?n=')[1];
alert(theNick);
}
index.html
<button onclick="callNick()">Click Me to view your Nickname.</button>
▶︎ Plunker where "form" has been changed to "index" and "index" to "result".
Note :
To pass multiple variables, you can use the & delimiter, and then use the window.location.search property as done in this CSS-tricks article.
▶︎ Multiple vars plunker

XPages csjs pass a variable into a function?

On a button click, I'm calling a function in client side JavaScript.
doIt("TEST");
"TEST" is just the ID of label on my XPage.
In the function, I want to use the variable I passed as an ID. Something like:
function doIt(item){
alert(dojo.query("[id$=':item']").innerHTML);
}
OR
function doIt(item){
val = XSP.getElementById("#{id:item}").innerHTML;
alert(val);
}
I have also tried using this, which gives undefined:
val = dojo.query("[id$=':" + item + "']").innerHTML;
alert(val);
If I hard code the ID name like so, then I get the correct innerHTML of the element with the ID "TEST":
val = XSP.getElementById("#{id:TEST}").innerHTML;
alert(val);
Where is my syntax wrong when trying to write this very simple line of code used the passed variable?
The easiest way is to call your function with the complete id:
doIt("#{id:Test}")
and to use it in your function
function doIt(item){
alert(dojo.byId(item).innerHTML);
}
In the "onclick" client-event in the button, (inside XPage or CC), the client Ids can be computed, so you should put there something like this:
doIt("#{id:Test}"); // << "#{id:Test}" is computed in the server-side and the final client ID is sent to the browser
Then, in your cjs library (cjs libraries are not "evaluated" before sending to the client, so here you cannot use "#{id:Test}" expressions) you should have something like:
function doIt(idElement) {
var domElem = dojo.byId(idElement); // << here you get the element
}

How to get global variable value to ajax

i am trying to get the global variable value inside ajax,jquery function.
here i am using this code..
code:
<script type="text/javascript">
var id;
function refreshRecord(id)
{
alert(id);
}
$(document).ready(function(){
$("#refresh").click(function(){
var fileId=id;
alert("id is"+fileId);
$.ajax({
type:"post",
url:"checkStatusAndNumRecs",
data: {fileId:fileId},
success:function(data){$("#div1").html(data);},
error:function(data){$("#div1").html("It was a failure !!!");}
});
});
});
</script>
Onclick one submit button i am calling the javascript function
<input type="radio" name="submit" value="submit" onclick="refreshRecord(this.value)">
Here what i want to get is, i have declared the global variable id in script tag,
when i click on radio button the onclick event calls the javascript function refreshRecord(id) with one parameter 'id'
now that id value will be set to some value. now i want to get that variable value inside jquery function and i want to assign it to
var fileId = id;
but when i did the above code and click button.
in alert it is showing the first value correctly(i.e the alert from javascript is coming correctly) but the alert from the ajax,jquery is coming is as undefined or [Object Object]
How can i resolve this??
You need to assign the value passed to the function to the global variable id. Currently you are not assigning it. The parameter id of the function is just local to the function , it is not the same global one and the global variable id is still undefined.
Just modify as below,
var id;
function refreshRecord(value)
{
id = value;
alert(id);
}
You should put the value from the field inside the global variable:
var id;
function refreshRecord(inputValue)
{
id = inputValue;
alert(id);
}
Because if you do this:
function refreshRecord(id)
{
alert(id);
}
the id global variable won't be accessible inside the refreshRecord function because of a name conflict inside the function scope. Please read about scope to understand:
http://robertnyman.com/2008/10/09/explaining-javascript-scope-and-closures/
The argument we pass inside a function acts as a local variable to that function. So in your function you are actually creating a local variable and setting the value.
Try this instead -
var id;
function refreshRecord() {
id = $("input:radio").val();
}
Give an id to have better selector for radio button.

Categories