Our client has two URL's that point to the same page. Depending on which URL the user comes through they want to display and hide certain content. I have the following code and everything looks like it should work (doesn't it always....) but for some reason the if doesn't evaluate to true. The alert is in there for troubleshooting purposes.
var this_page = window.location;
var calc_address = "DIFFERENT ADDRESS";
alert(this_page);
if(this_page == "http://www.calculatesnowguards.com/"){
$('#mashead').css('background-image', 'url("../images/masthead_bg.jpg") ');
$('.calc_remove').hide();
$('#bottom').innerHTML = calc_address;
}
window.location is not a string, it's only represented as so. It's actually an object. window.location.href is the variable you want to compare to.
EDIT: (In response to the comments below.) With such different URLs, why would you try to compare them directly?
if (window.location.href.indexOf("calculatesnowguards.com") >= 0) {
//code for calculatesnowguards.com
} else{
//code for snowguards.biz
}
EDIT2: Sorry, didn't realize that contains() was a Firefox only function. I extend String to include it in my scripts.
Related
I have two pages - "page 1" and "page 2". On page 1 there's an text-box with a value of e.g. 100 and a button at the end.
By pressing the button I want javascript to save the value of the textbox in a global (?) variable and jump to page 2. With "window.onload" I want a second Javascript-function to alert the value saved at page1.
Here's my Javascript code:
<script type="text/javascript">
var price; //declare outside the function = global variable ?
function save_price(){
alert("started_1"); //just for information
price = document.getElementById('the_id_of_the_textbox').value;
alert(price); //just for information
}
<script type="text/javascript">
function read_price(){
alert("started_2");
alert(price);
}
On "page 1" I have this send-Button with:
<input class="button_send" id="button_send" type="submit" value="Submit_price" onclick="save_price();"/>
It starts the Javascript function and redirects me correctly to my page2.
But with this ont the second page:
window.onload=read_price();
I always get an "undefined" value of the global variable price.
I've read a lot about those global variables. E.g. at this page: Problem with global variable.. But I can't get it working...
Why is this not working?
Without reading your code but just your scenario, I would solve by using localStorage.
Here's an example, I'll use prompt() for short.
On page1:
window.onload = function() {
var getInput = prompt("Hey type something here: ");
localStorage.setItem("storageName",getInput);
}
On page2:
window.onload = alert(localStorage.getItem("storageName"));
You can also use cookies but localStorage allows much more spaces, and they aren't sent back to servers when you request pages.
Your best option here, is to use the Query String to 'send' the value.
how to get query string value using javascript
So page 1 redirects to page2.html?someValue=ABC
Page 2 can then
read the query string and specifically the key 'someValue'
If this is anything more than a learning exercise you may want to consider the security implications of this though.
Global variables wont help you here as once the page is re-loaded they are destroyed.
You have a few different options:
you can use a SPA router like SammyJS, or Angularjs and ui-router, so your pages are stateful.
use sessionStorage to store your state.
store the values on the URL hash.
To do this, I recommend sending data within the link data. This is a very simple way of doing it without PHP. Simply get the link in the second page and replace the previous link with "".
Page_One.html:
<script>
//Data to be transfered
var data = "HelloWorld";
//Redirect the user
location.replace("http://example.com/Page_Two.html?" + data);
</script>
Page_Two.html :
<script>
//Get the current link
var link = window.location.href;
//Replace all content before ? with ""
link = link.replace("http://example.com/Page_Two.html?","");
//Display content
document.write("Page_One.html contains:" + link + "");
</script>
Hope it helps!
I have a simple Approach rather (Pure JS):
Page One :
Goto Your Info
Note : You've to encode your GTK value (i.e parameter value) in Base64
Next is Page TWO :
<script>
// first we get current URL (web page address in browser)
var dloc= window.location.href;
//then we split into chunks array
var dsplt= dloc.split("?");
//then we again split into final chunk array, but only second element
//of the first array i.e dsplt[1]
var sanitize= dsplt[1].split("=");
// now here comes the tricky part, join all elements into single //string. IT may be the case, that base64 string contain '=' sign, we shall find it
var dlen= sanitize.length;
var FinString= "";
// we will start from 1, bcoz first element is GTK the key we don't // want it
for(i=1;i<dlen;i++)
{
FinString= FinString+sanitize[i];
}
// afterwards, all the Base64 value will be ONE value.
// now we will convert this to Normal Text
var cleantxt= window.atob(FinString);
document.getElementById("yourname").innerHTML= "Your Name is : <b>"+cleantxt+" .";
You can do anything with the parameter decoded info... Like Redirecting visitor
immediately to another page thru a "POST" method form automatically submitted
by Javasript to Lead a php page finally, without an visible parameters, but with
invisible hidden parms.
I have two pages - "page 1" and "page 2". On page 1 there's an text-box with a value of e.g. 100 and a button at the end.
By pressing the button I want javascript to save the value of the textbox in a global (?) variable and jump to page 2. With "window.onload" I want a second Javascript-function to alert the value saved at page1.
Here's my Javascript code:
<script type="text/javascript">
var price; //declare outside the function = global variable ?
function save_price(){
alert("started_1"); //just for information
price = document.getElementById('the_id_of_the_textbox').value;
alert(price); //just for information
}
<script type="text/javascript">
function read_price(){
alert("started_2");
alert(price);
}
On "page 1" I have this send-Button with:
<input class="button_send" id="button_send" type="submit" value="Submit_price" onclick="save_price();"/>
It starts the Javascript function and redirects me correctly to my page2.
But with this ont the second page:
window.onload=read_price();
I always get an "undefined" value of the global variable price.
I've read a lot about those global variables. E.g. at this page: Problem with global variable.. But I can't get it working...
Why is this not working?
Without reading your code but just your scenario, I would solve by using localStorage.
Here's an example, I'll use prompt() for short.
On page1:
window.onload = function() {
var getInput = prompt("Hey type something here: ");
localStorage.setItem("storageName",getInput);
}
On page2:
window.onload = alert(localStorage.getItem("storageName"));
You can also use cookies but localStorage allows much more spaces, and they aren't sent back to servers when you request pages.
Your best option here, is to use the Query String to 'send' the value.
how to get query string value using javascript
So page 1 redirects to page2.html?someValue=ABC
Page 2 can then
read the query string and specifically the key 'someValue'
If this is anything more than a learning exercise you may want to consider the security implications of this though.
Global variables wont help you here as once the page is re-loaded they are destroyed.
You have a few different options:
you can use a SPA router like SammyJS, or Angularjs and ui-router, so your pages are stateful.
use sessionStorage to store your state.
store the values on the URL hash.
To do this, I recommend sending data within the link data. This is a very simple way of doing it without PHP. Simply get the link in the second page and replace the previous link with "".
Page_One.html:
<script>
//Data to be transfered
var data = "HelloWorld";
//Redirect the user
location.replace("http://example.com/Page_Two.html?" + data);
</script>
Page_Two.html :
<script>
//Get the current link
var link = window.location.href;
//Replace all content before ? with ""
link = link.replace("http://example.com/Page_Two.html?","");
//Display content
document.write("Page_One.html contains:" + link + "");
</script>
Hope it helps!
I have a simple Approach rather (Pure JS):
Page One :
Goto Your Info
Note : You've to encode your GTK value (i.e parameter value) in Base64
Next is Page TWO :
<script>
// first we get current URL (web page address in browser)
var dloc= window.location.href;
//then we split into chunks array
var dsplt= dloc.split("?");
//then we again split into final chunk array, but only second element
//of the first array i.e dsplt[1]
var sanitize= dsplt[1].split("=");
// now here comes the tricky part, join all elements into single //string. IT may be the case, that base64 string contain '=' sign, we shall find it
var dlen= sanitize.length;
var FinString= "";
// we will start from 1, bcoz first element is GTK the key we don't // want it
for(i=1;i<dlen;i++)
{
FinString= FinString+sanitize[i];
}
// afterwards, all the Base64 value will be ONE value.
// now we will convert this to Normal Text
var cleantxt= window.atob(FinString);
document.getElementById("yourname").innerHTML= "Your Name is : <b>"+cleantxt+" .";
You can do anything with the parameter decoded info... Like Redirecting visitor
immediately to another page thru a "POST" method form automatically submitted
by Javasript to Lead a php page finally, without an visible parameters, but with
invisible hidden parms.
I'm creating a project in Adobe Experience Manager and have run into problems in the implementation of my language switching component. The component is supposed allow the user to click on a link and have the language of the page change. For example, if they are on the English page /content/myproject/en/home.html and they click it, they are supposed to end up on /content/myproject/fr_ca/home.html.
As part of getting it up and running, I was trying to concatenate currentPage.path and "/profile.html" so that I could at least get the component to register some change to the string in the tag.
From the English home.html page, currentPage.path produces the string "/content/myproject/en/home". Concatenating it with /profile.html should produce the string "/content/myproject/en/home/profile.html" which it does if I use Sightly to do something like <p>${langinfo.goToPage}</p>.
However, if I try this: the component will show a blank anchor tag. It will also blank anything I've written in between the two anchor tags.
So far I've tried returning a string I've written out by hand "/content/myproject/en/home/profile.html" as the goToPage value and it works in the anchor tag. Also, if I only return currentPage.path it works. It refuses to work like this if I try to concatenate but it will work like this: <a>It works here!.
The best I can figure at this point is that currentPage.path is a Java String object that is being accessed by JavaScript and there are problems when JS tries to type it to a JavaScript string with +. It also doesn't work if I try to cast the statement as a string with either String(goToPage) or goToPage.toString(). It doesn't seem to matter when I cast it as a string. One blog I looked at seemed to hint that this was a problem with Rhino and that I should do a .toString() after the initial concatenation. That didn't work. Another post on stackOverflow seemed to point out that it could be a problem trying to concatenate a Java String object in JavaScript and pointed out that this should be taken into account but didn't go into how to deal with the issue.
I appending to a string isn't the intended end functionality of my component, but if I can't modify the string by concatenating, seems like I can hardly do a search and replace to change /en/ to /fr-ca/. If anyone has a more elegant solution to my problem than what I'm attempting, that would be appreciated as much as a fix for what I'm working on.
I've pasted my code here (as suggested) and posted screenshots of my code to help.
Javascript:
use(function() {
var pageLang = currentPage.properties.get("jcr:language", "en");
var otherLangText;
var currPage = currentPage.name;
var currPagePath = currentPage.path;
var goPage;
if (pageLang == "fr_ca") {
otherLangText = "English";
goPage = "/content/myproject/en/index/home.html";
} else {
otherLangText = "Français";
goPage = "/content/myproject/fr-ca/home/home.html";
};
return {
otherLanguage: otherLangText,
goToPage: goPage
}
})
HTML:
<nav data-sly-use.langinfo="langcontact.js">
<ul class="lang-list-container">
<li class="lang-list-item">${langinfo.otherLanguage}</li>
<li class="lang-list-item">Contact</li>
</ul>
</nav>
I'm pretty stumped here. What am I doing wrong?
The line <li class="lang-list-item">${langinfo.otherLanguage}</li>
should actually be -
<li class="lang-list-item">${langinfo.otherLanguage}</li>
What you are trying to do is pass an object to object which will not work, in case you want to pass the extension to be used in JS you need to do that in the USE call. Refer to the samples in this blog.
Update -
You code works fine for me as long as the link is valid.
use(function() {
var pageLang = currentPage.properties.get("jcr:language", "en");
var otherLangText;
var currPage = currentPage.name;
var currPagePath = currentPage.path;
var goPage;
if (pageLang == "fr_ca") {
otherLangText = "English";
goPage = currPagePath+"/profile.html";
} else {
otherLangText = "Français";
goPage = currPagePath+"/profile.html";
};
return {
otherLanguage: otherLangText,
goToPage: goPage
}
})
The only possible reason you are getting empty href is because your link is not valid and thus linkchecker is removing it. If you check on author instance you will see broken link symbol along with your link text.
Ideally you should fix the logic so that proper valid link is generated. On development you could disable the linkchecker and/orlink transformer to let all links work (even invalid ones | not recommended). The two services can be checked in http://localhost:4502/system/console/configMgr by searching for - Day CQ Link Checker Service and Day CQ Link Checker Transformer
I have two pages - "page 1" and "page 2". On page 1 there's an text-box with a value of e.g. 100 and a button at the end.
By pressing the button I want javascript to save the value of the textbox in a global (?) variable and jump to page 2. With "window.onload" I want a second Javascript-function to alert the value saved at page1.
Here's my Javascript code:
<script type="text/javascript">
var price; //declare outside the function = global variable ?
function save_price(){
alert("started_1"); //just for information
price = document.getElementById('the_id_of_the_textbox').value;
alert(price); //just for information
}
<script type="text/javascript">
function read_price(){
alert("started_2");
alert(price);
}
On "page 1" I have this send-Button with:
<input class="button_send" id="button_send" type="submit" value="Submit_price" onclick="save_price();"/>
It starts the Javascript function and redirects me correctly to my page2.
But with this ont the second page:
window.onload=read_price();
I always get an "undefined" value of the global variable price.
I've read a lot about those global variables. E.g. at this page: Problem with global variable.. But I can't get it working...
Why is this not working?
Without reading your code but just your scenario, I would solve by using localStorage.
Here's an example, I'll use prompt() for short.
On page1:
window.onload = function() {
var getInput = prompt("Hey type something here: ");
localStorage.setItem("storageName",getInput);
}
On page2:
window.onload = alert(localStorage.getItem("storageName"));
You can also use cookies but localStorage allows much more spaces, and they aren't sent back to servers when you request pages.
Your best option here, is to use the Query String to 'send' the value.
how to get query string value using javascript
So page 1 redirects to page2.html?someValue=ABC
Page 2 can then
read the query string and specifically the key 'someValue'
If this is anything more than a learning exercise you may want to consider the security implications of this though.
Global variables wont help you here as once the page is re-loaded they are destroyed.
You have a few different options:
you can use a SPA router like SammyJS, or Angularjs and ui-router, so your pages are stateful.
use sessionStorage to store your state.
store the values on the URL hash.
To do this, I recommend sending data within the link data. This is a very simple way of doing it without PHP. Simply get the link in the second page and replace the previous link with "".
Page_One.html:
<script>
//Data to be transfered
var data = "HelloWorld";
//Redirect the user
location.replace("http://example.com/Page_Two.html?" + data);
</script>
Page_Two.html :
<script>
//Get the current link
var link = window.location.href;
//Replace all content before ? with ""
link = link.replace("http://example.com/Page_Two.html?","");
//Display content
document.write("Page_One.html contains:" + link + "");
</script>
Hope it helps!
I have a simple Approach rather (Pure JS):
Page One :
Goto Your Info
Note : You've to encode your GTK value (i.e parameter value) in Base64
Next is Page TWO :
<script>
// first we get current URL (web page address in browser)
var dloc= window.location.href;
//then we split into chunks array
var dsplt= dloc.split("?");
//then we again split into final chunk array, but only second element
//of the first array i.e dsplt[1]
var sanitize= dsplt[1].split("=");
// now here comes the tricky part, join all elements into single //string. IT may be the case, that base64 string contain '=' sign, we shall find it
var dlen= sanitize.length;
var FinString= "";
// we will start from 1, bcoz first element is GTK the key we don't // want it
for(i=1;i<dlen;i++)
{
FinString= FinString+sanitize[i];
}
// afterwards, all the Base64 value will be ONE value.
// now we will convert this to Normal Text
var cleantxt= window.atob(FinString);
document.getElementById("yourname").innerHTML= "Your Name is : <b>"+cleantxt+" .";
You can do anything with the parameter decoded info... Like Redirecting visitor
immediately to another page thru a "POST" method form automatically submitted
by Javasript to Lead a php page finally, without an visible parameters, but with
invisible hidden parms.
I'm trying to get this conditional statement to work, but having no luck
<body onload="HashTagInsert()">
function HashTagInsert() {
var hash="window.location";
if (hash==="http://www.address.com#anchor1")
{
document.getElementById("insert-text").innerHTML="<h2>Title</h2><p>body text</p>";
}
else if (hash==="http://www.url.com/foler/code/page.html#anchor2")
{
document.getElementById("insert-text").innerHTML="<h2>Title</h2><p>body text</p>";
}
else ()
{
document.getElementById("insert-text").innerHTML="something else text"
}
}
</body>
If you want the hash variable to be the value of the window.location object, then don't put quotes around the object name as that will turn it into a string literal.
var hash = window.location;
I recommend not calling the variable hash though, as that could be confused with window.location.hash, which contains the fragment ID component of the URL.
Don't add quotes around window.location.
var hash = window.location.href;
If you want to compare your current window location with some string you need to set the "hash" variable correctly:
var hash = window.location;
but I am not sure if I got your problem.
In case that your javascript can not set your html properly, there is also a timing problem. It depends when your javascript gets called. Before or after your DOM has been rendered. Because if your javascript is executed before your DOM (and your element '#insert-text') is rendered, you wont be able to select this DOM element.
And ... but this is perhaps just my opinion, is is pretty uncool to have masses of if / else if / else constructions in your code.
You might want to map some url and text so that you do not need to make your life harder than it is.
for example:
var html;
var mapping = {
"http://www.address.com#anchor1":"<h2>Yeah</h2><p>Baby</p>",
"http://www.address.com#anchor2":"<h2>Cool</h2><p>Tomato</p>",
"default": "<h2>Woops</h2><p>Honolulu rocks</p>"
}
mapping[window.location.href] ? html = mapping[window.location.href] : html = mapping['default'];
document.getElementById("insert-text").innerHTML=html;