Multiple datasets not working when remote data sources used (introduced in latest release)

[nhouse]

I am having the same issue as described here: #104

I'm not sure whether I should be commenting in there, or creating a new issue, but since that was closed over a year ago I've chosen the latter.

The Typeahead example page shows how to use multiple datasets with Typeahead/Bloodhound. It works great when a local or prefetch data source is used, but it does not work with a remote data source.

I posted my problem on StackOverflow before stumbling across the above issue: http://stackoverflow.com/questions/24727145/multiple-datasets-not-working-with-twitter-typeahead-bloodhound-when-remote-data

I am using the latest version of Typeahead and Bloodhound from here: http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.min.js

[nhouse]

I thought I remembered having this working last week, but didn't mention it because I wasn't sure. However, I just noticed the latest version of typeahead was released only two days ago, so I just tried my code with the previous version (0.10.2) and it works:

http://jsfiddle.net/r98fU/1/

Here's the fiddle from my StackOverflow question using the latest version (which does not work):

http://jsfiddle.net/GSH4f/2/

So this bug was introduced in the latest version of Typeahead/Bloodhound.

[jharding]

Err, I think I've identified the issue and it looks like a legit bug 😦

Give me a chance to confirm the bug and I'll post a branch with a fix ASAP. Thanks for reporting this.

[jharding]

Alright, I've created the pull request #899. Here's a link to the bundle dist file for that pull request. When you get a chance can you see if that fixes your problem?

[nhouse]

Yep, that fixes it! Thanks!

[jharding]

Great! I'm going to reopen this issue; I'll close it once I have the fix merged into a proper release branch.

[jharding]

Fixed has been merged into integration-0.10.4.

[danielcmartin]

I'm using the v0.10.4 bundle file and still seeing the issue described above: two remote data sources and I'm only seeing one ajax request being made. If i switch around the order of the data sources in the typeahead it looks like only the first source works. In the stack overflow post the original problem was that only the second data source was being used, also it mentions that only the second data set was showing results. Instead I'm seeing two sets of results in the typeahead suggestions dropdown but its just the first data set duplicated.

[nhouse]

@danielcmartin I think your issue is unrelated to mine since both of your datasets are displaying.

It's likely not actually a bug, but rather due to the way Bloodhound caches requests. Are your endpoints for the data sources the same? If so, Bloodhound will cache the response even if URL parameters or POST data is different.

The only way I've found to stop Bloodhound from caching responses is to add the replace callback in the remote options:

storeHound = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: '/deals/action/tagSearch',
        replace: function(url, query) {
            return url + "#" + query + "store"; // used to prevent the data from being cached. New requests aren't made without this (cache: false setting in ajax settings doesn't work) NOTE: "store" added to prevent bloodhound instances from sharing results from same URL
        },
        ajax : {
            beforeSend: function(jqXhr, settings){
                settings.data = $.param({q: $(':focus').val(), t: "store"});

                if ($(':focus').val() == "") { // @todo bloodhound is sending ajax requests even when the input is empty after pressing tab in tagsinput
                    console.log("query empty, aborting bloodhound ajax request");
                    jqXhr.abort();
                }
            },
            data: $.param({q: "this value is not sent but must be here", t: "store"}),
            type: "POST"
        }
    }
});

You can view my full source code here if it helps (although I'm in the middle of an update atm so search isn't working): http://www.pricewombat.com/deals

[danielcmartin]

Thanks @nhouse you were right. The replace callback fixed my issue.

[sachintoshniwal]

Hello,

i am using bloodhounds js to bind autocomplete textbox. I am using cascading autocomplete just like select county & retrieve corresponding state.

When i select first country i got data in state autocomplete & again i select another country then same data display in state field.

bloodhounds data source is not returning update data. it returns old data.I am using local Storage option in bloodhounds js.

kindly suggest.

Thanks,
Sachin