Remote AJAX with POST and JSON, can't get typeahead('val') or parse output.

[jamcow]

I am trying to get remote ajax working with an input. I can only find others who have used %QUERY within the remote url. I need to POST the search query as JSON - which I have partially managed.

I can't seem to find a way of putting the input query into the AJAX. Below I've manually put in 'fire' which works and returns results for eg, fire engine, firework etc... Originally I had two search inputs, one for product category and another for user input query, hence: partialSearchString: 'fire' and category: 'all'

Here is my current code, which works to the point of correctly sending an AJAX POST request and getting an data.array back.

this is a combination of so:set-remote-in-typeahead and the ajax code I was working with:

    var productsearcher = new Bloodhound({
        datumTokenizer: function (d) {
            return Bloodhound.tokenizers.whitespace(d.value);
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        replace: function (url, uriEncodedQuery) {
            return url + "#" + uriEncodedQuery;
            // the part after the hash is not sent to the server
        },
        remote: {
            url: "/products/productsearchsuggestions",
            ajax: {
                type: "POST",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({
                    partialSearchString: 'fire',
                    category: 'all'
                }),
                success: function (data) {
                    console.log("Got data successfully");
                    console.log(data);
                }
            }
        }
    });

    // initialize the bloodhound suggestion engine
    productsearcher.initialize();

    // instantiate the typeahead UI
    $('.typeahead').typeahead(null, {
        displayKey: 'value',
        source: productsearcher.ttAdapter()
    });

console.log(data) returns an array:

Array[10]
    0: Object
        DisplayValue: "<b>Fire</b>work"
        Type: 0
        Value: "Firework"
        __proto__: Object
    1: Object
        DisplayValue: "<b>Fire</b> Engine"
        Type: 0
        Value: "Fire Cement"
        __proto__: Object
etc...

Can anyone help me put the query input into the ajax and parse the data array back into the tt-dropdown-menu list?

Or if there are any other AJAX/remote examples out there...

[westonplatter]

@jharding I need this for a business requirement - on a scale of 1 to 10, how hard would this be to fix, build, and pull the source for my requirement? I'd love to do it if it's within reach.

[jquacinella]

Did anyone else get this working?

[westonplatter]

@jquacinella no. I ended up forking the version we were on to implement the between GET/POST switching logic. I don't have access to the code, otherwise I would share. Best of luck!