Can't call JavaScript function from PHP using a string as a parameter

Question

I am using a PHP script to get data from a MySQL server. Once I get that data, I'm looping through it (still in PHP) and using it to output a series of datasets each with their own button

        $returnString = '<form action="/iOS/action_page.php" method="post">';
        
        // output data of each row
        while($row = $result->fetch_assoc()) {
            
            $echoString = '<h2>Study Title: '. $row['title'] . '</h2>';
            
            $echoString .= '<h3>Study Nickname: ' . $row['nickname'] .'</h3>';
            
            $echoString .= '<button type="button" id="login-button" Onclick="setUrl(' . rawurlencode($row['title']) . ')"> View Tasks </button>';
                            
            echo $echoString;
        }

(The "title" of the row is a string that may or may not have spaces and such, like "Hello%20World")

The 'setUrl' function sits outside of the PHP brackets and just tries to move to a new page:

        <script>
          function setUrl(tableTitle) {
              window.location.href = "https://exampleWebsite.com/PHPPage.php?id=".concat(tableTitle);
          };

       </script>

But every time I try to click a button, I get this error popping up in the console:

SyntaxError: No identifiers allowed directly after numeric literal

The only way I can get it to work is by passing in an Integer rather than a string, but that doesn't work for my use case.

Does this answer your question? Difference between Javascript and PHP — Nico Haase
– Nico Haase, Commented Sep 2, 2021 at 9:43

David · Accepted Answer · 2021-09-01 21:38:48Z

2

Mixing three different languages on a single line of code drastically increases the chances of string quoting errors. Consider what this line of code outputs:

$echoString .= '<button type="button" id="login-button" Onclick="setUrl(' . rawurlencode($row['title']) . ')"> View Tasks </button>';

If the "title" value is a string, the resulting button is:

<button type="button" id="login-button" Onclick="setUrl(some string)"> View Tasks </button>

Which means the JavaScript you're trying to execute is:

setUrl(some string)

Which is invalid because strings need to have quotes around them.

The quickest approach is to simply add those quotes:

$echoString .= '<button type="button" id="login-button" Onclick="setUrl(\'' . rawurlencode($row['title']) . '\')"> View Tasks </button>';

A more sustainable solution would be to separate your JavaScript from your HTML entirely. Output just the button with the "title" as a data attribute:

$echoString .= '<button type="button" id="login-button" data-title="' . rawurlencode($row['title']) . '"> View Tasks </button>';

Then in separate JavaScript (either on the page itself or linked from a .js file), bind the click handler:

document.querySelector('#login-button').addEventListener('click', function () {
  setUrl(this.getAttribute('data-title'));
});

answered Sep 1, 2021 at 21:38

David

221k42 gold badges245 silver badges337 bronze badges

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

1 Comment

Jeff Cournoyer Over a year ago

Thanks! I learned mainly how to code in Swift, so the thought of putting 3 different languages on the same line is crazy to me! But I appreciate it! I knew I had to add quotes somewhere, I just didn't know where.

Barmar · Accepted Answer · 2021-09-01 21:38:42Z

1

You need quotes around the argument in the JavaScript.

$echoString .= '<button type="button" id="login-button" onclick="setUrl(\'' . rawurlencode($row['title']) . '\')"> View Tasks </button>';

answered Sep 1, 2021 at 21:38

Barmar

789k57 gold badges554 silver badges669 bronze badges

Collectives™ on Stack Overflow

Can't call JavaScript function from PHP using a string as a parameter

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related