How to pass string in Javascript function dynamically

Question

I have a javascript function like this

function doIt(link) {
    alert(link);
}

And i call this function in below given JS code, where i am creating an a tag and appending it to my html page on runtime:

jQuery.each(data, function (i, val) {
    var card = '<a href="Views/NewsDetail.html" onclick=" doIt(' + val.Img + '); "> \
                <div class=" card"> \
                <img src='+ val.Img + ' /> \
                <p>'+ val.Title + '</p> \
                </div> \
                </a>';
    document.getElementById('News').innerHTML += card;
});

Say for example our val.Img = 'abcd' When i click the a tag it calls doIt(abcd), but i want to call doIt('abcd') passing it as string.

Is there any workaround for this.

Doesn't it redirect to another page `Views/NewsDetail.html` when you click anchor tag? — Vicky Gonsalves, Sep 25 '15 at 11:28
Thanx everyone for helping me. though i can only accept one answer but giving +1 for helping me. — Murtaza Munshi, Sep 25 '15 at 11:35

Satpal · Accepted Answer · 2015-09-25T11:30:06.460

2

You need to escape quotes like

var card ='<a href="Views/NewsDetail.html" onclick="doIt(\'' + val.Img + '\'); "> \
                                                        //^               ^

As per your current implementation the argument abcd is treated as variable thus you must be getting undefined

edited Sep 25 '15 at 11:30

answered Sep 25 '15 at 11:25

Satpal

132,252
13
159
168

lemme try this and get back to you. – Murtaza Munshi Sep 25 '15 at 11:27
Yeah exactly it is giving me undefined. – Murtaza Munshi Sep 25 '15 at 11:31

Ivin Raj · Answer 2 · 2015-09-25T11:42:33.337

2

You can do this one:

var card='<a href="Views/NewsDetail.html;" onClick="Test(\'' + val.Img + '\'); "></a>';

edited Sep 25 '15 at 11:42

answered Sep 25 '15 at 11:28

Ivin Raj

3,448
2
28
65

rajuGT · Answer 3 · 2015-09-25T11:40:00.040

1

The below HTML string already used both quotes till the characters doIt(. So any string type values inside the quotes, must be escaped using any of the quote-character.

 var card = '<a href="Views/NewsDetail.html" onclick=" doIt(' + val.Img + '); ">'

to [added quote escape character \"]

 var card = '<a href="Views/NewsDetail.html" onclick=" doIt(\"' + val.Img + '\"); ">'

edited Sep 25 '15 at 11:40

answered Sep 25 '15 at 11:26

rajuGT

6,224
2
26
44

I am talking about the tag. The tag is working fine. Thanx for helping though. – Murtaza Munshi Sep 25 '15 at 11:28
Oh! corrected to anchor tag. As you know in JS both ' and " are same. Just use the other-quote to escape instead of \quote-char. Code looks clean and easy to track string concat issues. – rajuGT Sep 25 '15 at 11:31
Sorry, in this case we have to escape the double quote as we have already used both the quotes. so any string inside onclick= " ........ " has to be escaped. – rajuGT Sep 25 '15 at 11:35

score 0 · Answer 4 · answered Sep 25 '15 at 11:34

Yet another option:

   var doItAndRedirect=function(val){
           //do stuff with val here
       window.location = "Views/NewsDetail.html"; 
    }

    jQuery.each(data, function (i, val) {
        var card = '<a href="javascript:doItAndRedirect(\''+ val +'\')">'+
                    '<div class=" card">' +
                    '<img src='+ val.Img + ' />' +
                    '<p>'+ val.Title + '</p>' +
                    '</div>'+
                     '</a>';
        document.getElementById('News').innerHTML += card;
    });

score -1 · Answer 5 · answered Sep 25 '15 at 11:27

-1

It is already a string it just doesn't display '' on alert but at the background it is string only.

answered Sep 25 '15 at 11:27

Sunil

919
15
25

@MurtazaMunshi but you said in your question that function getting called as doIt(abcd); – Sunil Sep 25 '15 at 11:32

score -1 · Answer 6 · edited May 23 '17 at 12:14

-1

doIt("' + val.Img + '");

should do it, but if you have, e.g, " inside val.Img you need to quote those: How do I add slashes to a string in Javascript?

edited May 23 '17 at 12:14

Community

1
1

answered Sep 25 '15 at 11:28

Kjell Post

19
4

How to pass string in Javascript function dynamically

6 Answers6