Passing string parameter in JavaScript function

Question

I was trying to pass a string to a JavaScript function.

As it's mentioned here - Pass a string parameter in an onclick function

I'm using this simple code-

<!DOCTYPE html>
<html>

    <body>
        <script>
            name = "Mathew";
            document.write("<button id='button' type='button' onclick='myfunction(\''" + name + "'\')'>click</button>")

            function myfunction(name)
            {
                alert(name);
            }
        </script>
    </body>

</html>

But in the console it's giving an error like Uncaught SyntaxError: Unexpected token }.

Any reason you're trying to add a table cell to a page without a table? — Andy, Aug 12 '15 at 09:23
Note that the top answer to that question also recommended proper DOM methods, something you might want to consider - it would prevent these kind of issues coming up. — Andy, Aug 12 '15 at 09:26

score 19 · Accepted Answer · answered Aug 12 '15 at 09:27

19

Change your code to

document.write("<td width='74'><button id='button' type='button' onclick='myfunction(\""+ name + "\")'>click</button></td>")

answered Aug 12 '15 at 09:27

Juned Lanja

1,466
10
21

Nina Scholz · Answer 2 · 2015-08-12T10:01:13.993

10

Rename your variable name to myname, bacause name is a generic property of window and is not writable in the same window.

And replace

onclick='myfunction(\''" + name + "'\')'

With

onclick='myfunction(myname)'

Working example:

var myname = "Mathew";
document.write('<button id="button" type="button" onclick="myfunction(myname);">click</button>');
function myfunction(name) {
    alert(name);
}

edited Aug 12 '15 at 10:01

answered Aug 12 '15 at 09:23

Nina Scholz

376,160
25
347
392

1

it's not printing anything in alert box if I use this code. – Anurag Chakraborty Aug 12 '15 at 09:28
1

function myfunction(myname) { alert(myname); } – Grant Johnson Jul 19 '22 at 21:17

score 6 · Answer 3 · edited Oct 08 '20 at 22:39

The question has been answered, but for your future coding reference you might like to consider this.

In your HTML, add the name as an attribute to the button and remove the onclick reference.

<button id="button" data-name="Mathew" type="button">click</button>

In your JavaScript, grab the button using its ID, assign the function to the button's click event, and use the function to display the button's data-name attribute.

var button = document.getElementById('button');

button.onclick = myfunction;

function myfunction() {
  var name = this.getAttribute('data-name');
  alert(name);
}

DEMO

score 6 · Answer 4 · edited Oct 08 '20 at 22:42

6

document.write(`<td width='74'><button id='button' type='button' onclick='myfunction(\``+ name + `\`)'>click</button></td>`)

Better to use `` than "". This is a more dynamic answer.

edited Oct 08 '20 at 22:42

Peter Mortensen

30,738
21
105
131

answered Dec 16 '19 at 08:29

banoth ravinder

1,314
15
18

score 3 · Answer 5 · edited Oct 08 '20 at 22:41

You can pass string parameters to JavaScript functions like below code:

I passed three parameters where the third one is a string parameter.

var btn ="<input type='button' onclick='RoomIsReadyFunc(" + ID + "," + RefId + ",\"" + YourString + "\");'  value='Room is Ready' />";

// Your JavaScript function

function RoomIsReadyFunc(ID, RefId, YourString)
{
    alert(ID);
    alert(RefId);
    alert(YourString);
}

Omkar Gharat · Answer 6 · 2021-10-08T13:16:39.967

2

Try this ...

onclick="myfunction('name')";

edited Oct 08 '21 at 13:16

answered Sep 21 '21 at 07:53

Omkar Gharat

99
1
5

score 1 · Answer 7 · edited Oct 08 '20 at 23:05

1

Use this:

document.write('<td width="74"><button id="button" type="button" onclick="myfunction('" + name + "')">click</button></td>')

edited Oct 08 '20 at 23:05

Taslim Oseni

6,086
10
44
69

answered Aug 12 '15 at 09:33

Sameer

705
10
25

1

document.write('') – Sameer Aug 12 '15 at 09:34

Passing string parameter in JavaScript function

7 Answers7

Linked