Passing PHP variable to JavaScript through functions

Question

I have the following text in a field from my database:

Studied project requirements and documented specifications accordingly
Developed routing models for PDMS piping and associated equipment
Designed 3D illustrations for rough and final layout of piping routes and structures
Created elevated support system for complex piping structures to ensure proper functioning and safety
Provided detailed fabrication drawings
Performed stress and functional tests for new and existing designs
Upgraded existing layouts and structures as per the design and safety standards
Prepared plot plans and equipment layout
Developed isometric drawings, general arrangement drawings and support detail drawings

I'm fetching it out of the database through a variable (i.e. $text) and then parsing it through a javascript function function(text) in order to post the text into a form textarea field for editing.

But when I click the button to run the function, it doesn't do anything. If the text is smaller it works fine. Is there any limit to the characters of a javascript variable?

PHP code:

<?
$var = mysql_fetch_row($query);
$text=$var['cool'];

echo "<a onclick=\"func($text)\">button</a>";
?>

<script>
function func(text) {   
        $('<div>cool: '+text+'</div>').fadeIn('slow').appendTo('.somediv');
}
</script>

I don't think it's a problem with the text being too long for JavaScript. It's only 645 characters. [This post](http://stackoverflow.com/a/5926426/259457) claims to have used a 60 MB string and it worked fine. — Travesty3, Aug 25 '12 at 21:18
I know. I still don't get it why it wouldn't come up. There are no ' or " characters to be of any problem in the string. — Crys Ex, Aug 25 '12 at 21:19
My actual function has 9 variables, would that be a problem? (function edit_o(emp, loc, from, to, title, dept, desc, token, ord)) — Crys Ex, Aug 25 '12 at 21:22
Don't mind that code. I just put it fastly. The text is fetched from the database correctly. — Crys Ex, Aug 25 '12 at 21:25
@Mihai: that will fail if the string contains new lines (which it does) — Eric, Aug 25 '12 at 21:26
why don't you write the `$text` in some hidden div then append it and show ? — Mihai Iorga, Aug 25 '12 at 21:28
Yes. the new lines are the problem. "\n", let's see how I could replace them to fit my needs =) — Crys Ex, Aug 25 '12 at 21:31

Lethargy · Answer 1 · 2012-08-25T22:35:26.913

4

You need to encode your arguments:

$text = htmlspecialchars(json_encode($var['cool']));

That said, the other solution may be better in the long run, because the elements will already be in the correct place in the page. It depends on what you're trying to do with it.

Edit: The escaping may not be perfect. Please test it extensively.

edited Aug 25 '12 at 22:35

answered Aug 25 '12 at 21:31

Lethargy

1,859
14
15

Very clever. Completely forgot you could use json for simple strings. – Eric Aug 25 '12 at 21:33
I had to fire up the php interpreter to check ;) – Lethargy Aug 25 '12 at 21:35
1

That's probably a problem with your javascript. Have you tried putting the appendTo before the fadeIn? – Lethargy Aug 25 '12 at 21:37
Yep. Tried putting appendTo before fadeIn, it still doesn't show. – Crys Ex Aug 25 '12 at 21:40
@Lethargy can you enlighten me how can you use `json_encode()` here please. Please take in consideration single-quotes, double-quotes and html tags. – Mihai Iorga Aug 25 '12 at 21:44
Have you checked your browser console for helpful javascript errors? How about using a javascript breakpoint inside your function to see if the arguments are getting there correctly. Or just view the raw source of the page to see if things look right. – Lethargy Aug 25 '12 at 21:44
@Mihai Iorga: I've updated it to escape the double quote the json includes. json_encode will already escape most things, this should be enough to get it to the javascript safely. Whether the text inside the divs needs further escaping depends on what's in the database. – Lethargy Aug 25 '12 at 21:55
Did you test it? Even if it works, OP said it has 9 variables, wouldn't be a huge mess? – Mihai Iorga Aug 25 '12 at 21:59
I never claimed this would be pretty ;) http://pastebin.com/Qfbyp9Ah You could do some array juggling to do 9 parameters, just `implode(', ', $array)` an array of pre-escaped params. – Lethargy Aug 25 '12 at 22:04

score 1 · Answer 2 · answered Aug 25 '12 at 21:30

1

I would do this: (because of the text in javascript limitations)

<?php
    $var = mysql_fetch_row($query);
    $text=$var['cool'];

    echo "<div id=\"hiddendiv\" style=\"display:none\">".$text."</div><a onclick=\"func()\">button</a>";
?>

<script type="text/javascript">
function func(text) {   
    $('#hiddendiv').fadeIn('slow').appendTo('.somediv');
}
</script>

answered Aug 25 '12 at 21:30

Mihai Iorga

39,330
16
106
107

Hmm this looks fine. It seems that I'll have to change most of my website structure but it will get me out of future trouble with JS vars :) – Crys Ex Aug 25 '12 at 21:39
It will get your of trouble especially if you are using multiple vars in function call, you can pass only the div ID's in that function. Outputting the hole text, even escaped, encoded will be a huge mess you will will never understand anything. – Mihai Iorga Aug 25 '12 at 21:56
Escape your text, else you'll have an XSS vulnerability! – Eric Aug 26 '12 at 12:00

Passing PHP variable to JavaScript through functions

2 Answers2