Yes, it's possible, but in your case I'd say it's not really a viable option. You said you have about 3000 movie titles in total. For example, the "Storyline" for Firefly at imdb has 862 characters. Add some more for image urls, cast or whatever else you have, I'm guessing you will have at the very least 1k characters per movie, which means loading 3MB on every single page request. In my opinion, the page load will be too slow for people on 3G connection, not to mention that you will put unnecessary load on your servers and most likely have to pay more since you will have more data traffic.
However, for the sake of answering your question, you can
$arr = array(1, 'b', 3);
$arr_as_string = json_encode($arr);
printf('<script type="text/javascript">var arr = eval(%s);</script>',
'('.$arr_as_string.')');
Do note that you should use a json decoder rather than eval. JSON is a subset of javascript, which means that a json decoder won't be able to execute javascript code that eval would, while still being able to transform json strings into their corresponding objects and arrays.
Also note that once you're all set to start using ajax, the process is very simple. In fact, it's not more complicated than pre-loading the data.
/* The correct content-type for JSON-encoded data is application/json, but IE7 can't handle
* that. Neither can IE8 iirc. As such, you have to go with text/plain
*/
header('content-type: text/plain; charset=utf-8');
/* Additionally, IE doesn't respect your content-type headers. Why would you know more about
* the content-type that you have decided to send than Mircorsoft?
* Solution: Add a MS proprietary header letting them know that you really do know better than them
*/
header('x-content-type-options: nosniff');
# I suspect these would come from a DB. Hard coded array for simplicity
$movies = array
(
0 => array
(
'image' => '',
'storyline' => '',
'cast' => ''
),
1 => array
(
'image' => 'http://t3.gstatic.com/images?q=tbn:ANd9GcRDJa_5XzivdJsEF0_xUNlRYp1V53eoixDjKLR-KkMbkZeLNX9Ixw',
'storyline' => "Whedon in outer space!",
),
2 => array
(
'image' => 'http://t1.gstatic.com/images?q=tbn:ANd9GcRn6Z6f39E6Zl740YTJGJ_xTClmkFx_Xmv5z8zsDix9gB3tqaYv',
'storyline' => "Whedon is a doll.",
)
);
$_GET['id'] = isset($_GET['id']) ? (int) $_GET['id'] : 0;
echo json_encode($movies[$_GET['id']]);
<!-- You can obviously download jQuery to your own server instead: http://jquery.com/ -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
function getMovieInfo(el)
{
$.ajax({
url: '/get_movie.php',
/* Converter jQuery.parseJSON is automatically applied when data is of type 'text json' */
dataType: 'text json',
/* This is the data sent to the server. GET request used unless otherwise specified */
data: 'id=' + el.value,
/* Function called on success. You should probably handle failures as well */
success: function(data)
{
$('#movieImage').attr('src', data.image);
$('#storyline').html(data.storyline);
$('#cast').html(data.cast);
}
});
}
</script>
<style type="text/css">
</style>
</head>
<body>
<h4>Movie Titles</h4>
<div>
<select onchange="getMovieInfo(this);">
<option value="0">Please Select...</option>
<option value="1">Firefly</option>
<option value="2">Dollhouse</option>
</select>
</div>
<img id="movieImage" src="" alt="" />
<h3>Storyline</h3>
<div id="storyline"></div>
