I am developing a site for thriller movies. I want to fetch data from IMDB. I need to use Ajax to fetch data asynchronously. My code does not work well.
The movie info is not appearing in the carousal. The html file which fetch data :
<?php
require_once('functions.php');
$triangle = getMovieInfo('triangle');
$Predestination = getMovieInfo('Predestination');
$silence_of_the_lambs = getMovieInfo('The Silence of the Lambs');
$shutter_island = getMovieInfo('Shutter Island');
?>
<br>
<!-- Text which has greater value -->
<div>
<div class = "row">
<div class="alert alert-success text-center" role="alert"><h3>If you are looking for a site, where you can see the list of all verified thrillers, then you are at the right place.</h3></div>
</div>
</div>
<!-- slider for the home page -->
<div class="container">
<div class="row">
<div class = "col-md-6 col-lg-6 col-sm-6">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<?php echo "<img src=\"$triangle->Poster\">"; ?>
<!-- <span> <?php echo "Plot : ".$triangle->Plot; ?> </span> -->
</div>
<div class="item">
<?php echo "<img src=\"$silence_of_the_lambs->Poster\">"; ?>
<!-- <span> <?php echo "Plot : ".$silence_of_the_lambs->Plot; ?> </span> -->
</div>
<div class="item">
<?php echo "<img src=\"$Predestination->Poster\">"; ?>
<!-- <span> <?php echo "Plot : ".$Predestination->Plot; ?> </span> -->
</div>
<div class="item">
<?php echo "<img src=\"$shutter_island->Poster\">"; ?>
<!-- <span> <?php echo "Plot : ".$shutter_island->Plot; ?> </span> -->
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<div class ="col-md-6 col-lg-6 col-sm-6">
<div class="well">
<div class="thriller">
<h3>What is a thriller movie?</h3>
<h4>If the genre is to be defined strictly, a genuine thriller is a film that rentlessly pursues a single-minded goal - to provide thrills and keep the audience cliff-hanging at the 'edge of their seats' as the plot builds towards a climax.</h4>
<h4>
Believe me, I love watching thriller movies more than anything. These movies are real movies, where you can't guess the last scene. I enjoyed a lot of thriller movies and then thought to make a site, where you can easily watch a movie.
</h4>
</div>
</div>
</div>
</div>
</div>
The getMovieInfo function is here: function getMovieInfo($title) { $title = urlencode($title);
//Call the omdb api
$json=file_get_contents("http://www.omdbapi.com/?t=$title");
$details=json_decode($json);
//Check if response contains the movie information
if($details->Response=='True')
{
return $details;
}
else
{
echo "Movie information not available.Please confirm title";
}
}
My java script file is:
$(document).ready(function()
{
$("#home").click(function(event)
{
alert("home is clicked");
$('#contents').load('home.html');
});
});
Please help me to solve this.
