CODEWITHSUNDEEP
javascriptphpjqueryajax
zolfaghari
zolfaghari

Reputation: 202

How can load IMDB Movie information using AJAX

I have this code to get IMDB movies information I have a site http://microdownload.ir to download free movies.

For information of series of movies i need to use IMDB API and i used this below code but its refresh my pages and post my article before complete that so i need to get information with Ajax i used following code

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Get IMDB Info</title>
</head>

<body>
  <center>
    <form method="post">
      Address : <input type="text" name="url" size="50"   placeholder="Example: http://www.imdb.com/title/tt1340138" dir="ltr"><br><br>
      <input type="submit" value="Get">
    </form>
  </center>
  <br><br>
  <?php 
    error_reporting(E_ERROR | E_PARSE);
    if(empty(!$_POST['url'])){
        echo '<div dir="ltr">';
        function IMDB ($url){
            preg_match("/tt\\d{7}/i", $url, $Id);
            $Get = file_get_contents('http://www.omdbapi.com/?i='.$Id[0]);
            $json = json_decode($Get,true);
            return $json;
        }

        $Response = IMDB($_POST['url']);
        if(!$Response){
            die ('خطا!');
        }
        echo "Title: ".$Response['Title'].'<br>'.
        "Year: ".$Response['Year'].'<br>'.
        "Rated: ".$Response['Rated'].'<br>'.
        "Released: ".$Response['Released'].'<br>'.
        "Runtime: ".$Response['Runtime'].'<br>'.
        "Genre: ".$Response['Genre'].'<br>'.
        "Director: ".$Response['Director'].'<br>'.
        "Writer: ".$Response['Writer'].'<br>'.
        "Actors: ".$Response['Actors'].'<br>'.
        "Plot: ".$Response['Plot'].'<br>'.
        "Language: ".$Response['Language'].'<br>'.
        "Country: ".$Response['Country'].'<br>'.
        "Awards: ".$Response['Awards'].'<br>'.
        "Poster: ".$Response['Poster'].'<br>'.
        "Metascore: ".$Response['Metascore'].'<br>'.
        "imdbRating: ".$Response['imdbRating'].'<br>'.
        "imdbVotes: ".$Response['imdbVotes'].'<br>'.
        "imdbID: ".$Response['imdbID'].'<br>'.
        "Type: ".$Response['Type'].'<br>'.
        "Response: ".$Response['Response'].'<br>'.
        '</div>'
        ;


    }
    ?>
</body>

</html>

Its work fine but I want to Receive data with AJAX ( without reload page) to my <p></p> tags It mean when i click to get data, my data set to <p></p> tags automatic

Upvotes: 1

Views: 2296

Answers (1)

SAMUEL
SAMUEL

Reputation: 8552

Can you pls try this :-

$(document).ready(function() {
    $('#imdbInfoForm').on('submit', function(e) {
        e.preventDefault();
        var arr = $('#imdbUrl').val().match(/tt(\d+)/);
        var imdbId = arr[0];
        $.ajax({
                url: "http://www.omdbapi.com/?i=" + imdbId,
                success: function(data) {
                    $('#result').html('Title: ' + data.Title + '<br>' + 'Year: ' + data.Year + '<br>' + 'Rated: ' + data.Rated + '<br>' + 'Released: ' + data.Released + '<br>' + 'Runtime: ' + data.Runtime + '<br>' + 'Genre: ' + data.Genre + '<br>' + 'Director: ' + data.Director + '<br>' + 'Writer: ' + data.Writer + '<br>' + 'Actors: ' + data.Actors + '<br>' + 'Plot: ' + data.Plot + '<br>' + 'Language: ' + data.Language + '<br>' + 'Country: ' + data.Country + '<br>' + 'Awards: ' + data.Awards + '<br>' + 'Poster: ' + data.Poster + '<br>' + 'Metascore: ' + data.Metascore + '<br>' + 'imdbRating: ' + data.imdbRating + '<br>' + 'imdbVotes: ' + data.imdbVotes + '<br>' + 'imdbID: ' + data.imdbID + '<br>' + 'Type: ' + data.Type + '<br>' + 'Response: ' + data.Response + '<br>');

                }
            })
            .done(function(data) {
                if (console && console.log) {
                    console.log("Sample of data:", data.slice(0, 100));
                }
            });
    })
});
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Get IMDB Info</title>
</head>

<body>
  <center>
    <form id="imdbInfoForm" method="post" >
      Address : <input type="text" name="url" size="50"   placeholder="Example: http://www.imdb.com/title/tt1340138" dir="ltr"><br><br>
      <input type="submit" value="Get">
    </form>
  </center>
   <div id="result">
        </div>
 
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 
</html>

Upvotes: 1

Related Questions