How to call JavaScript function from a PHP printed button

Question

What a weird question. If anyone has a better title for this, please go ahead and edit it; I can't think of what else to call it. I am printing a button from PHP using echo. The purpose of a button is to show a form by calling a JavaScript function that uses document.getElementById() to change the style attribute of the form tag to visible so the form is visible to the user. The problem I'm having is that the echoed string has to have quotes around it, the onclick event has to have quotes around it, and the parameter passed to the JavaScript function has to have quotes around it. I tried escpaing the quotes for the parameter with backslashes but that didn't work. Can anyone help me?

Here is my code:

echo "<input type = 'button' onclick = 'showform(\'psswdform\')' value = 'Change password'>";//this shows the form and needs quotes

JavaScript function:

function showform(id)
{
document.getElementById(id).style.visibility = "visible";
}

You can use single quotes where possible but you have to escape your double quotes in for instance showform(\"psswdform\") — Toon Casteele
– Toon Casteele, Commented Apr 25, 2013 at 9:55
You can't have single quotes inside single quotes... When the parser encounters the second single quote it thinks that's it. Unless you're not aware that PHP will escape those single quotes. — MMM
– MMM, Commented Apr 25, 2013 at 10:03

Daan Timmer · Accepted Answer · 2013-04-25 10:00:15Z

3

This works fine for me? (working example)

<?php

echo "<input type = 'button' onclick = 'showform(\"psswdform\")' value = 'Change password'>";//this shows the form and needs quotes

Generates:

<input type = 'button' onclick = 'showform("psswdform")' value = 'Change password'>

answered Apr 25, 2013 at 10:00

Daan Timmer

15.1k7 gold badges39 silver badges69 bronze badges

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

Comments

AwesomeBobX64 · Accepted Answer · 2013-04-25 09:54:50Z

2

Try concatenating the string using a combination of single and double quotes like this:

echo '<input type="button" onclick="showform(' . "'psswdform'" . ')" value="Change password">';

answered Apr 25, 2013 at 9:54

AwesomeBobX64

3412 silver badges4 bronze badges

Comments

if __name__ is None · Accepted Answer · 2013-04-25 10:08:44Z

1

Try this:

echo "<input type = 'button' onclick = 'showform('psswdform')' value = 'Change password'>";

Additionally, you could try jQuery, a super popular JS Library that makes life easier.

I would make the following CSS class.

.hide {
   display:none;
}

Than I would add the following jQuery:

$("#show-password-reset").click(function(event){
 event.preventDefault();
 $("#passwdform").show();
});

And finally include your show button:

<input id="show-password-reset" type = 'button' value = 'Change password'>

Make sure to use class="hide" on the passwdform element so its hidden when page loads.

edited Apr 25, 2013 at 10:08

answered Apr 25, 2013 at 10:03

if __name__ is None

11.6k18 gold badges58 silver badges73 bronze badges

Comments

KillerX · Accepted Answer · 2013-04-25 09:54:13Z

0

Inside PHP \ is already an escape character. If you want to output "\" you need to echo "\\".

answered Apr 25, 2013 at 9:54

KillerX

1,4661 gold badge15 silver badges26 bronze badges

2 Comments

KillerX Over a year ago

I see you already got your answer, just thought I can elaborate a bit. What the accepted example did was change the inner single quotes to double quotes that are then escaped in the php string. My suggestion (although written with not much explanation) was to keep using the single quote. So by doing echo "onclick = 'showform(\\'psswdform\\')'" your output will be onclick = 'showform(\'psswdform\')' and that will again be at execution time parsed as showform('psswdform'), so you end up with the correct result.

imulsion Over a year ago

oh, I see now. I'm sorry for my comment, I just didn't understand

Collectives™ on Stack Overflow

How to call JavaScript function from a PHP printed button

4 Answers 4

Comments

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related