Get a string in a variable to create a dynamic link in Javascript

Question

What I am trying to accomplish is to have a map that has a few locations. Whenever users click on each location, a popup will emerge with some information. I am trying to create a dynamic link inside that popup.

Below is my code in Javascript

function parseDescription(message){
    var string=""

    for(var i in message){
        if (i=="CommunityPartner"){
            string+='<span style="font-weight:bold">'+i+'</span>'+": "+message[i]+'</a>'+"<br>"
        } else if (i=="WeitzCECPartner"){
            string+='<span style="font-weight:bold">'+i+'</span>'+": "+message[i]+'</a>'+"<br>"
        } else if (i=="PhoneNumber"){
            string+='<span style="font-weight:bold">'+i+'</span>'+": "+message[i]+'</a>'+"<br>"
        } else if (i=="Website"){
            var link = "http://www."+message[i];
            string+='<span style="font-weight:bold">'+i+'</span>'+": "+'<a href="{{link}}" >'+link+'</a>'+"<br>"
        }
        //string+='<span style="font-weight:bold">'+i+'</span>'+": "+message[i]+"<br>"
    }
    return string;
}

I keep getting this error. I think it's related to the value passed into "a href" :

Request Method: GET
Request URL:    http://127.0.0.1:8000/%7B%7Blink%7D%7D

Please help

HugoTeixeira · Accepted Answer · 2018-10-12 21:01:49Z

4

Instead of using {{link}} in the string, you can try this:

var link = "http://www." + message[i];
string += '<span style="font-weight:bold">' + i + '</span>: <a href="' + link + '">' + link + '</a><br>';

answered Oct 12, 2018 at 21:01

HugoTeixeira

4,9143 gold badges25 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Willem van der Veen · Accepted Answer · 2018-10-12 21:09:12Z

The following syntax:

{{link}}

is incorrect, because this part was inside a string it was interpreted by the JS engine as a string.

You can use template strings (backticks `) to insert variables as string into another string. For example:

`<span style="font-weight:bold">${i}</span>:<a href="${link}" >${link}</a><br>`;

This example assumes that link and i are both variables which you want to insert dynamically into your string. If you have more questions leave a comment.

Alkis Mavridis · Accepted Answer · 2018-10-12 21:03:02Z

0

I think the problem lies in the {{link}}. Your code looks like native js and not angular or any other framework. Thus, the characters {{}} inside a string do not mean anything. The url that you get is exactly those characters, escaped. Use plain old string concatination to enter your href value.

answered Oct 12, 2018 at 21:03

Alkis Mavridis

1,25515 silver badges38 bronze badges

Collectives™ on Stack Overflow

Get a string in a variable to create a dynamic link in Javascript

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related