Javascript: Can't pass variables as parameters with onClick

Question

I have this code (jquery):

function somefunction() {

        $.ajax({
        type : 'POST',
        url : 'post.php',
        dataType : 'json',

        success : function(data){

            var mess = "";  
            var count = 0;

            while (count < (data.length - 1))
            {

                 mess = mess + "<a href=# onclick=deletePerson("JohnDoe");return false;><img src=x.gif></a>" + data[count].name + "<br />";
                 count++;
            }


            $('#mydiv').html(mess).fadeIn('fast');


        },
    });


}
function deletePerson(arg) {...}

When I run this, everything works fine. However, when I want to pass a variable (instead of "JohnDoe") with the onclick, it stops working:

var myvar = "JohnDoe";
mess = mess + "<a href=# onclick=delete(myvar);return false;><img src=x.gif></a>" + data[count].name + "<br />";

My editor tells me: "Unresolved variable or type".

Never had a problem with passing parameters, but with this onClick-thing it just doesn't work...

Anyone knows what I'm doing wrong?

Thank's a lot!

EDIT: Joseph's post fixed the JohnDoe problem (thanks!), however, when I put:

var myvar = data[count].name;

it stops working... any thoughts?

Creating HTML and binding event handlers like this is error prone and therefore bad style. Consider using jQuery to do this. — Felix Kling
– Felix Kling, Commented Oct 23, 2011 at 18:42
this is a very bad way to bind events. If you're using jquery, you should use it: $('<a href="#">').click(...)... — zzzzBov
– zzzzBov, Commented Oct 23, 2011 at 19:12

Joseph Marikle · Accepted Answer · 2011-10-23 18:37:35Z

1

You need to concatenate the variable in

myvar = "JohnDoe";
mess = mess + "<a href=# onclick=delete('"+myvar+"');return false;><img src=x.gif></a>" + data[count].name + "<br />";

edited Oct 23, 2011 at 18:37

answered Oct 23, 2011 at 18:32

Joseph Marikle

78.8k18 gold badges114 silver badges130 bronze badges

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

3 Comments

Felix Kling Over a year ago

You are missing quotes around the argument.

Mike Over a year ago

Also maybe take the var off of "var myvar" so it becomes global, don't know where he/she is declaring it.

binoculars Over a year ago

Ok, now it works with "JohnDoe". However, I need the var to be data[count].name. So when I put var myvar = data[count].name; (inside the while loop off course) it stops working again... The delete() function doesn't get called, nothing happens. Any thoughts?

deviousdodo · Accepted Answer · 2011-10-23 18:58:06Z

0

delete is a reserved keyword in javascript, you should rename your function.

...
mess = mess + "<a href=# onclick=deletePerson('"+myvar+"');return false;><img src=x.gif></a>" + data[count].name + "<br />";
...
function deletePerson(name) {...}

answered Oct 23, 2011 at 18:58

deviousdodo

9,1722 gold badges32 silver badges35 bronze badges

3 Comments

binoculars Over a year ago

My bad, the function isn't actually named delete, but the translation of "to delete" in my native language. Changed it for stackoverflow, but hadn't thought about the reserved-keyword-thing. Thanks for pointing this out, problem still unfixed though...

deviousdodo Over a year ago

@binoculars Are you sure data is an array? Do a console.log() to check it out, maybe it's a string, or maybe the array elements don't have a name property. Also, you should update the code in your post so that it matches the current state.

binoculars Over a year ago

I'm sure it's an array and it exists, since the while loop with data[count].name inside it works just fine... (update my code)

Collectives™ on Stack Overflow

Javascript: Can't pass variables as parameters with onClick

2 Answers 2

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related