Insert From Input Into API URL jQuery

Question

I'm fairly new to jQuery and would really appreciate some help with the following:

I've got an input form that allows user to select 3 different geo regions (country, region and city) All information comes from an API. I'd need the input from country (as the user types) to go into the URL that makes the call to the API for "city". This way the user gets only the cities relevant to the country.

This is what I have:

<input type="text" name="country" id="country" />
<input type="text" name="city" id="city" />

$(document).ready(function() {
        $("#country").tokenInput("http://someurl.com/search?q=", {
            method: "POST",
            searchDelay: 0,
        });

        $("#city").tokenInput("http://someurl.com/search?q=[Insert values form country input field]", {
            method: "POST",
            searchDelay: 0,
        });
    });

The jQuery plugin I'm using: this.

you are using a plugin , would need to research the API docs for the plugin on how to add data. Post a link to plugin docs — charlietfl
– charlietfl, Commented Nov 2, 2012 at 3:31
Hi @charlietfl thanks for that. Here the link to the plugin: loopj.com/jquery-tokeninput — Georg
– Georg, Commented Nov 2, 2012 at 3:34

charlietfl · Accepted Answer · 2012-11-02 03:55:21Z

1

I don't see it documented but the source of the plugin code allows a function to be used for the url option.

This should work:

$("#city").tokenInput(function(){
      return 'http://someurl.com/search?country='+ $('#country').val() +'q=';
     }, {
      method: "POST",
      searchDelay: 0,
});

If it gives you any problem, inspect the request in a browser console to see what the final url generated is, or see if any errors are thrown

answered Nov 2, 2012 at 3:55

charlietfl

172k14 gold badges125 silver badges154 bronze badges

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

1 Comment

charlietfl Over a year ago

you might go the feature/bug tracker and mention this could be documented...I may have missed it in docs, but I don't think it's there

Collectives™ on Stack Overflow

Insert From Input Into API URL jQuery

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related