mantsali Posted September 4, 2014 Share Posted September 4, 2014 Help I am trying to pass a php variable into a javasript function. Here is my code. <a href="<?php echo $row['track']; ?>" download="<?php echo $row['track']; ?>" onclick="myhit(<?php echo $row['track']; ?>)">Download</a> <script> function myhit(top){ alert(top); } </script> the javascript function is never called Quote Link to comment Share on other sites More sharing options...
Ch0cu3r Posted September 4, 2014 Share Posted September 4, 2014 Because you need to wrap the value you are passing to the myhit( ) JavaScript function in quotes. ...onclick="myhit('<?php echo $row['track']; ?>')" Do note that PHP code and javascript code are not ran at the same time. They are completely different languages. PHP is server side and Javascript is client side. Quote Link to comment Share on other sites More sharing options...
Solution Jacques1 Posted September 4, 2014 Solution Share Posted September 4, 2014 You can't just drop a PHP value into a JavaScript context. Depending content of the variable, this either results in a bug or even a major security vulnerability. Adding quotes also misses the point: Maybe you no longer see the problem, but of course it's still there. You must escape the value and put it into a standard HTML context. You can use a data attribute, for example. Then fetch the track from this attribute: <!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"> <title>Passing PHP values to JavaScript</title> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <script> $(function () { $('#track-link').click(function () { alert('This is the track: ' + $(this).data('track')); }); }); </script> </head> <body> <a id="track-link" href="#" data-track="http://example.com/some.track">Download</a> </body> </html> Do not forget the escaping! Safely inserting a value into a href attribute is even harder, but I guess that's another story. Quote Link to comment Share on other sites More sharing options...
mantsali Posted September 4, 2014 Author Share Posted September 4, 2014 tried all your examples and the javascript function is never called. the issue is, i have to download the track and send the track to a different page and im retrieving the track name from a mysql database. Quote Link to comment Share on other sites More sharing options...
Jacques1 Posted September 4, 2014 Share Posted September 4, 2014 (edited) Did you try this exact code? Then the function is definitely called – unless you've played with your browser settings and turned off JavaScript or something. So the actual question is: What did you do to break the code? Since I'm not psychic, I cannot answer this until you actually post your script. If possible, create a minimal example which we can try out. Then we don't have to speculate about possible problems. It's also a good idea to check for error messages in the JavaScript console of your browser. You usually have to hit F12 to open the developer tools and then go to the JavaScript tab. // I realized that I only gave you the resulting HTML markup. The underlying PHP script is this: <?php $row['track'] = 'http://example.com/some.track'; ?> <!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"> <title>Passing PHP values to JavaScript</title> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <script> $(function () { $('#track-link').click(function () { alert('This is the track: ' + $(this).data('track')); }); }); </script> </head> <body> <a id="track-link" href="#" data-track="<?= htmlspecialchars($row['track'], ENT_QUOTES, 'UTF-8') ?>">Download</a> </body> </html> Edited September 4, 2014 by Jacques1 Quote Link to comment Share on other sites More sharing options...
mantsali Posted September 4, 2014 Author Share Posted September 4, 2014 this is what my link looks like <a id="track-link" href="<?php echo $row['trackLoc']; ?>" download="<?php echo $row['trackLoc']; ?>" data-track="<?= htmlspecialchars($row['trackLoc'], ENT_QUOTES, 'UTF-8') ?>">Download</a> the track does download but thats all that happens Quote Link to comment Share on other sites More sharing options...
Jacques1 Posted September 4, 2014 Share Posted September 4, 2014 That link alone doesn't really tell us anything. Create a minimal example of the problem so that we can actually try it out. Also, did you check the JavaScript console like I suggested? And of course you have to escape all values, not just the one that goes into the data attribute. Quote Link to comment Share on other sites More sharing options...
mantsali Posted September 4, 2014 Author Share Posted September 4, 2014 escape all values? but thats the part that is working, here is the sample code ive been working with <!DOCTYPE HTML> <html> <head> <script> $(function () { $('#track-link').click(function () { alert('holla'); alert('This is the track: ' + $(this).data('track')); }); }); </script> </head> <body> <?php $con=mysqli_connect("localhost","root","","mnjush"); $result = mysqli_query($con,"SELECT * FROM music"); while($row = mysqli_fetch_array($result)) { echo $row['artist'] ; ?> <a id="track-link" href="<?php echo $row['trackLoc']; ?>" download="<?php echo $row['trackLoc']; ?>" data-track="<?= htmlspecialchars($row['trackLoc'], ENT_QUOTES, 'UTF-8') ?>">Download</a> <?php echo "<br>"; } mysqli_close($con); ?> </body> </html> Quote Link to comment Share on other sites More sharing options...
Jacques1 Posted September 4, 2014 Share Posted September 4, 2014 You skipped the external jQuery script I posted above, but that's actually important: <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> This goes into the head element before the other script. Of course you're free to use plain JavaScript instead. You also can't have multiple elements with the same ID. Use a class. escape all values? but thats the part that is working Then you have a strange definition of “working”. Quote Link to comment Share on other sites More sharing options...
mantsali Posted September 4, 2014 Author Share Posted September 4, 2014 wow thanks its working, just needed the external script. You were right Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.