Home/ Questions/Q 5980581
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-22T21:49:17+00:00

i want to display 700 products data in a select box and on per

  • 0

i want to display 700 products data in a select box and on per selection i have to print a table of description . before i was doing ajax call and showing the data but the process is slow. So i have to send all the data to the client side and then use javascript to change the table of description on option change. Below is my code 

   <?php
     $data = json_encode( get_data_from_db() );
    ?>

<input type='hidden' name='data' id='data' value= " <?php echo $data; ?>" />

when i do alert in jquery 

 alert( $("#data").val() );

i only see

{[

value in the alert but when i print the data on the browser it does print in json format ok.

how can i get this data in the javascript and then i have to use loops to extract the data against a specific id and make ul li out of that and then embedd it. please suggest the right approach and whats wrong with the alert. thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Another solution – instead of creating global variable, set that data as an data- attribute of some related element. Don’t forget to perform json_encode() on whole array/object and then htmlspecialchars() on resulting string (as others have noted, lack of htmlspecialchars() is the reason why you got only “{[” when alerting value of input field). Don’t forget to specify ENT_QUOTES, when calling htmlspecialchars(), or you might have invalid results if any value contains apostrophe character.

    <?php
    $users = array(
        array('name' => 'Average', 'surname' => 'Joe'),
        array('name' => 'Average', 'surname' => 'Jane'),
        array('name' => 'Joe', 'surname' => 'Sixpack'),
        array('name' => 'John', 'surname' => 'Doe'),
        array('name' => 'Hong', 'surname' => 'Gildong'),
        array('name' => 'Foo', 'surname' => 'Bar'),
    );
?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<head>
    <title>sandbox</title>
    <meta http-equiv='content-type' content='text/html; charset=UTF-8'/>
    <script type='text/javascript' src='js/jquery-1.6.1.min.js'></script>
</head>
<body data-users='<?php echo htmlspecialchars(json_encode($users), ENT_QUOTES); ?>'>
    <script type='text/javascript'>
        $(function() {
            var users = $(document.body).data('users');
            for ( var n in users ) {
                $('<div/>').text(users[n].name + ' ' + users[n].surname).appendTo(document.body);
            }
        });
    </script>
</body>
</html>

    This makes 6 <div/> elements with all names and surnames as their contents.

    • 0