Creating a dynamic URL from a text input = Returning "undefined" in URL string

Question

I'm trying to create a URL that passes an input text into a query string for an AJAX call. In the console, I can see that I'm capturing the inputted text as a string, but it's not passing into the URL and It's returning an empty object.

<form action="" method="GET">
    <input type="text" id="movie-title" placeholder="Enter a movie title">
    <input type="submit" id="sbmt-movie">

</form>

$("#sbmt-movie").click(function(){
    var movie = $("#movie-title").val().toLowerCase();
    console.log("the movie title is " + movie);
    var url =  "https://api.themoviedb.org/3/search/movie?query=" + encodeURIComponent(url) + "&api_key=9b97ec8f92587c3e9a6a21e280bceba5"; 

    $.ajax ({
        url: url,
        dataType: "json",
        success: function (data) {
            console.log(data);

            var list = data.list;
        }
    }); //close .ajax    
});

This is the information that I'm seeing in console:

XHR finished loading: GET "https://api.themoviedb.org/3/search/movie?query=undefined&api_key=9b97ec8f92587c3e9a6a21e280bceba5".

Object {page: 1, results: Array[0], total_results: 0, total_pages: 1}

Link to Codepen

Mike Hamilton · Accepted Answer · 2015-11-21 22:04:52Z

1

Your issue lies in the line

var url =  "https://api.themoviedb.org/3/search/movie?query=" + encodeURIComponent(url) + "&api_key=9b97ec8f92587c3e9a6a21e280bceba5";

You are trying to use the function encodeURIComponent() on the variable url which is technically not yet defined. What I imagine you want to do instead is encodeURIComponent(movie).

var url =  "https://api.themoviedb.org/3/search/movie?query=" + encodeURIComponent(movie) + "&api_key=9b97ec8f92587c3e9a6a21e280bceba5";

Take a look at my updated codepen here.

answered Nov 21, 2015 at 22:04

Mike Hamilton

1,5651 gold badge16 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

GUL · Accepted Answer · 2015-11-21 22:02:39Z

0

You are passing url to encodeURIComponent and not movie

answered Nov 21, 2015 at 22:02

GUL

1,1971 gold badge13 silver badges22 bronze badges

Collectives™ on Stack Overflow

Creating a dynamic URL from a text input = Returning "undefined" in URL string

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related