I am trying to do the following: We need an easy way for user to find out what "id" their system has for remote support for example. I want to create a shortcut on everyone's desktop that leads to a website which then shows them their id with a query string (?id=..).
For example: the shortcut to https://example.com/support/index.html?id=80085 should open up a website which then shows "Your ID is 80085, please contact +1 123 456 for support or visit our online help page"
I am able to do all of that in html except showing the id in the body of the website
Does anyone have an example how I could do something like this?
If I understand what you are trying to do, basically I would create an HTML page with a simple div with an ID (for it to be found in script), and create a script that manipulates the url and places the corresponding text in the page.
...
<body>
<div id="main-div"></div>
<script>
const div = document.getElementById('main-div');
const element = document.createElement('p');
const id = new URLSearchParams(window.location.search).get('id');
if (!id) {
const emptyIdText = document.createTextNode('There was an error');
element.appendChild(emptyIdText);
} else {
const idText = document.createTextNode('Your ID is ' + id + ', please contact +1 123 456 for support or visit our online help page');
element.appendChild(idText);
}
div.appendChild(element);
</script>
</body>
...
If you need, you can place this script in a .js file and import it via the src attribute of the script tag. Hope this helps!
You can get the id parameter by converting the current url to a URL object in JavaScript like so
// get the current url
const url = new URL(window.location.href)
// extract the id parameter from the url
const id = url.searchParams.get('id')
// print the results to the screen
console.log(`Your ID is ${id} please call ...`)
Related
I'm trying to implement google ads conversion on my website and as per the google team, I added the tags they gave yet the conversion is not showing up properly.
After getting in touch with one of the team members, he told me to correct the code:
So far My code:
I m passing an email value through the URL to the 'Thank-you' page.
I m echoing the value inside a hidden input tag and calling it back using ID in javascript
I can get the value from the input and print it in the console.
<input type="hidden" id="email_for_ads" value="some#email.com">
<script>
var email_for_ads = $("#email_for_ads").val();
var enhanced_conversion_data = {
"email": email_for_ads
};
console.log(email_for_ads);
</script>
I can see the email id in the console, and I'm sure the value is being fetched.
But he said it should be like below upon inspect :
<input type="hidden" id="email_for_ads" value="some#email.com">
<script>
var email_for_ads = $("#email_for_ads").val();
var enhanced_conversion_data = {
"email": "some#email.com"
};
console.log("some#email.com");
</script>
I even tried the below code too
var baseUrl = (window.location).href; // You can also use document.URL
var email_for_ads = baseUrl.substring(baseUrl.lastIndexOf('=') + 1);
//var email_for_ads = $("#email_for_ads").val();
var enhanced_conversion_data = {
"email": email_for_ads
};
console.log(email_for_ads);
yet the same output. I can see the value in the console but on inspect. But he insists that it is that way and could be able to see the email value directly in inspecting itself.
Can someone understand, whether this is possible, if so, how can i do it.
It's possible, but very very weird, and I'd highly recommend against it - it doesn't provide any benefits except, I guess, when debugging, but when debugging it'd be easier to just retrieve the input value.
If you wanted the input value to be printed directly in the <script> tag, you'd have to create the script tag dynamically, either with document.createElement('script') or document.write.
For that to be possible, you'd need another script tag to create the dynamic script tag.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="hidden" id="email_for_ads" value="some#email.com">
<script>
// remove this script tag
document.currentScript.remove();
// append new script tag, with the input value directly in the source code
const email_for_ads_first = $("#email_for_ads").val();
document.write(`
<script>
var email_for_ads = $("#email_for_ads").val();
var enhanced_conversion_data = {
"email": "${email_for_ads_first}"
};
console.log("${email_for_ads_first}");
// log this script tag contents, so you can see what's in it:
console.log(document.currentScript.textContent);
<\/script>
`);
</script>
There's no good reason do this. Please don't.
You may need a server-side rendering technology to generate your email value into your HTML and scripts.
You can consider starting a service in nodejs, get the email value in the request,and in the responseļ¼return the email with your html and scripts.
What I'm trying to achieve is when a user authenticates with Instagram, and they're redirected to a page like "http://domainnamehere./instagram#access_token=27744335.fcaef44.a95s9e741f3c4ea7bcad21d80809ca40"
To be able to print the "27744335.fcaef44.a95s9e741f3c4ea7bcad21d80809ca40" string on a part of the web page, i.e.
<p>Here is your access token: ________</p>
I know how to print the whole URL using javascript, using this:
<h3 id="right">
<script type="text/javascript">
document.write(location.href);
</script>
</h3>
But how can I set it up to get only part of the URL?
Exactly what I'm trying to achieve can be seen here live http://theultralinx.com/instagram (click "setup instagram," authenticate, and then the next page shows the access token.
Thank you!
You can still look for an URI parser, but it might be obtained using basic string functions like indexOf and substring as follows:
var uri = "http://domainnamehere./instagram#access_token=27744335.fcaef44.a95s9e741f3c4ea7bcad21d80809ca40";
var indexOfHashVar = uri.indexOf("access_token=");
// 13 is the number of characters of "access_token="
var token = uri.substring(indexOfHashVar + 13);
console.log(token);
As #PhistucK suggested in some comment, you might get the hash part of the whole uri using window.location.hash, thus my sample may be altered in the first line with:
var uri = window.location.hash;
Never use document.write, it is discouraged.
This should work.
HTML -
<p>Here is your access token: <span id="access-token"></span></p>
JavaScript -
window.addEventListener("load", function () {
// Getting the part of the URL that starts with #.
var hash = document.location.hash,
// Storing the string for which we search in the hash.
accessTokenParameter = "access_token=";
// Setting the found value as the content of the access-token element we created
// above by taking the part of the hash (substring) that begins after the
// parameter by getting the index of the character (indexOf) with which the
// parameter name starts and adding the length of the parameter name (and =)
// in order to get past the name and start from the value.
document.getElementById("access-token").innerHTML =
hash.substring(hash.indexOf(accessTokenParameter) +
accessTokenParameter.length);
}, false);
In order to support Internet Explorer as well, you can use window.onload = or name the function and use window.attachEvent after feature detecting it.
<h3 id="right">
<script type="text/javascript">document.write(window.location.hash.split("access_token=")[1]); </script>
</h3>
you can use this
<h3 id="right"> <script type="text/javascript"> var href = location.href; href = href.replace("http://domainnamehere./instagram#access_token=",""); document.write(href); </script> </h3>
if ur link is always like the link in the question (same domain & no other variables) u can use this:
var url =location.href ;
var res = url.slice(45);
console.log(res);
I am trying to share variables between two html pages. I am only using javascript and HTML5 to develop a windows 8 app. Based on an image which a user clicks on one page, I want a div on a second page to be populated with that image. Any ideas?
When I click on the image, I am currently calling the following function:
function imageClick(url) {
//var id = parsed.ClientID;
//window.location= url + "?" + id
window.location = url;
}
Then in my html file, I have this line:
<img onclick="imageClick('pages/page2/page2.html')"
data-win-bind="src:image" style="width: 133px; height: 125.5px;">
I was thinking of getting that id in the next page's url (if I were to uncomment the commented lines above) but it's a bit hackky and I don't actually know how to go about executing the retrieval of that on the next page..
Is there a more efficient and easy way of doing this in javascript? Like an equivalent of sessions in php or something?
Javascript does not have session variables because it runs on the client side. You can use URL parameters and cookies in order to achieve the same results.
You can get the URL parameter by using this function:
http://ziemecki.net/content/javascript-parsing-url-parameters
Add the link to the image to the query part of the url when they click. Something like you had in the comment, assuming you don't have a query part already:
function imageClick(url) {
//var id = parsed.ClientID;
window.location= url + "?src=" + url.src;
//window.location = url;
}
The other page can use window.location.search to extract it, strip off the src=. The code would look something like this:
var src = window.location.search;
if (src.indexOf("src=") == 0) {
src = src.substring(4);
}
newPageImageElement.src = src;
Where newPageImageElement is the <img> where you want to display the picture on the second page.
I'm creating a bilingual website for a client. Two versions of the site in different languages will be created and stored in two folders:
/en/
/chi/
What I want to do is create a link to toggle between the two languages. On the conceptual level, I understand that Javascript can detect the current URL and split it into its different components, modify parts of it (in this case change between /en/ and /chi/), and then go to that new URL when the link is clicked.
But I have zero knowledge in javascript so I have no idea how to execute... I have come across this page:
http://css-tricks.com/snippets/javascript/get-url-and-url-parts-in-javascript/
but it doesn't explain how to modify and go to the new link.
You help will be greatly appreciated!!
To not break usability considerations like Shift + Click to open in a new window, you should create a plain old link (<a>) that points to the other language URL. There's nothing wrong with building the link via JavaScript, but you could also do it on the server using PHP or whatever templating language you're using.
Here's a script that does this with JavaScript if that's what you decide you'd like to do.
<!DOCTYPE html>
<body>
Content before the link.
<script>
(function () {
// this assumes you're on the en version and want to switch to chi
var holder = document.createElement("div");
var url = window.location.href.replace("/en/", "/chi/");
var link = document.createElement("a");
link.innerText = "Chewa"; // or whatever the link should be
link.href = url;
holder.appendChild(link);
document.write(holder.innerHTML);
})();
</script>
Content after the link.
</body>
If you simply want to take the full URL and replace /en/ with /chi/ or vise-versa, use the code below.
HTML
<span onclick="SwitchLang()">View [Some other Language]</span>
JavaScript
function SwitchLang() {
//Does URL contain "/en/"?
if(window.location.href.indexOf("/en/") != -1) {
//URL contain "/en/", replace with "/chi/"
window.location.href = window.location.href.replace("/en/", "/chi/");
}
//Does URL contain "/chi/"?
else if(window.location.href.indexOf("/chi/") != -1) {
//URL contain "/chi/", replace with "/en/"
window.location.href = window.location.href.replace("/chi/", "/en/");
}
}
Or, a bit more concise (un-commented version)
function SwitchLang() {
if(window.location.href.indexOf("/en/") != -1)
window.location.href = window.location.href.replace("/en/", "/chi/");
else if(window.location.href.indexOf("/chi/") != -1)
window.location.href = window.location.href.replace("/chi/", "/en/");
}
Note: In JS, when you modify window.location.href, the new URL is automatically loaded.
Here's a working fiddle for you to play with.
It looks like you need to change the window.location.pathname. For example:
// assuming the url `http://www.example.org/en/foo/bar/page.html`
var paths = window.location.pathname.split("/");
// change `en`
paths[1] = "chi";
// go to the new url
window.location.pathname = paths.join("/");
See:
https://developer.mozilla.org/en/DOM/window.location
I am trying to send an email (using Outlook mail) from a jsp page.
Requirement is, when the user clicks on send email button the data stored in a string
(with HTML tags) should be passed to the mailbody.
But the problem is, the text displayed in mail body is not formatted as HTML text.
Could you please suggest how to format it as HTML text in Outlook Doc.
I have used the below code in a function-
function OpenOutlookDoc(whatform,msgBody)
{
outlookApp = new ActiveXObject("Outlook.Application");
nameSpace = outlookApp.getNameSpace("MAPI");
mailFolder = nameSpace.getDefaultFolder(6);
mailItem = mailFolder.Items.add(whatform);
mailItem.Display(0);
mailItem.To = "abc#xyz.com";
mailItem.Subject = "TEST MAIL";
mailItem.Messageclass = whatform;
mailItem.Body = msgBody; //the text here is concatenated with HTML tags
mailItem.Send();
}
Thanks for you upcoming help..
After some google'ing:
The MSDN should help:
http://msdn.microsoft.com/en-us/library/aa171418%28v=office.11%29.aspx
The article includes an example to send html emails using vb-script. Converting that to javascript should not be hard - but since activex only works from within Internet Explorer you might as well use vbscript.
Try adding message.IsBodyHtml = true; to your code.
otherwise u can refer this example.