How to insert a JavaScript variable in href?

Question

I'm trying to put a JavaScript variable in the href.

<a href="http://google.com/{$order.paymentBefore}/{$order.guid}">click here</a>

When I am using href, because I want the link to appear as "Click here", it stays in the link as it is --> {$order.paymentBefore}/{$order.guid}, unchanged.

What template engine were you expecting was going to parse that variable? WHat langauge are the variables created in — charlietfl, Jan 26 '15 at 10:17
wirte a function that generates the href. You can not mix html and js like you did. — Stimpson Cat, Jan 26 '15 at 10:17
Look at this post: http://stackoverflow.com/questions/4772774/how-do-i-create-a-link-using-javascript — Stimpson Cat, Jan 26 '15 at 10:18

prog1011 · Answer 1 · 2015-01-26T10:40:24.650

7

Use click event for <a> as below

HTML

<a onclick="redirectTo();">click here</a>

JavaScript function

function redirectTo(){
     var parameter1 = $order.paymentBefore; // some thing like this you can set value for 1st Param.
     var parameter2 = $order.guid; // some thing like this you can set value for 2nd Param.
    window.location.href="http://google.com/"+parameter1+"/"+parameter2;

}

edited Jan 26 '15 at 10:40

answered Jan 26 '15 at 10:25

prog1011

3,425
3
30
57

@NikaKvezereli - if above answer is useful for you then `accept` the answer and `upvote` it will be helps other to find correct solutions. – prog1011 Jan 26 '15 at 10:42
This is awesome – STA Oct 26 '20 at 15:28

score 1 · Answer 2 · edited Jul 15 '16 at 04:41

1

You can mention href value upto what static value you have and the variable can be given in onclick call. See below example:

    var orderLink= "xyz";
     <a style="font-size:large;align-content:center" 
href="http://<static value>" onclick="location.href = this.href + orderLink; return false;"> Click Here </a>

edited Jul 15 '16 at 04:41

soorapadman

4,451
7
35
47

answered Jul 15 '16 at 04:02

Vijaya

11
1

Anirudh Ajith · Answer 3 · 2015-01-26T10:35:37.940

In your javascript, include a function that changes the href of to what you want. You cannot use it the way you have.

Let your html tag look something like this.

<a id="hyperlink" href="#">Click Here</a>

Now create a javascript function which updates the url whenever you call it.

function myFunction() { //Call this function whenever you want to update the href
    var link = document.getElementById("hyperlink");
    link.href = "http://google.com/" + $order.paymentBefore + "/" + $order.guid;
}

How to insert a JavaScript variable in href?

3 Answers3