User input not reflected properly in AJAX URL call

Question

Trying to use user's city input (ex. Los Angeles) and include in Ajax URL parameters, however when I console.log(searchURL). It doesn't add a '+' between "los angels" thus breaking the URL. What can be done to make the URL include the + between cities with two words.

var apiKey = "&client_id=OTU3MDMwMHwxNTEwMjUwNDQ0LjI3"
var baseQueryURL = "https://api.seatgeek.com/2/events?" + apiKey;
console.log(baseQueryURL);

function runSearch(queryURL) {
  $.ajax({
      url: queryURL,
      method: 'GET'
    }).done(function(response) {
        console.log(response);
      };

      $("#submitSearch").on("click", function(event) {
        //prevents default event from occuring
        event.preventDefault();

        userCity = $("#userCity").val();
        console.log(userCity);
        //create variable queryCity to hold city queried with URL parameters
        var queryCity = "&venue.city=" + userCity;
        //create searchURL to pass in as queryURL in AJAX call
        searchURL = searchURL + queryCity;
        console.log(searchURL);
        runSearch(searchURL);
      });

David · Accepted Answer · 2017-11-14 00:03:45Z

2

URL-encode the value:

userCity = encodeURIComponent($("#userCity").val());

answered Nov 14, 2017 at 0:03

David

221k42 gold badges247 silver badges338 bronze badges

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

Comments

Stephen · Accepted Answer · 2017-11-14 00:11:40Z

-1

I've used this:

userCity.split(" ").join("+")

answered Nov 14, 2017 at 0:11

Stephen

12 bronze badges

Collectives™ on Stack Overflow

User input not reflected properly in AJAX URL call

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