How to use Bloodhound Suggestion Engine? (Multi property objects being passed locally)

So I have an object passed that looks like this:

[{id: 1, name: 'Project A', type: 'C'}, {id: 2, name: 'Project B', type: 'A'},]

And I am trying to pass it through the Bloodhound Engine like so:

    var mySource = new Bloodhound({
    identify: function (obj) { return obj.id; },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
    local: datasource
});

To be used by typeahead.js like so:

$(control)
    .typeahead({
            hint: true,
            highlight: true,
            minLength: 0
        },
        {
            source: mySource
        });

But it simply never works. I'm not sure what I am doing wrong.

I just want name to be searchable. The ID and type are being passed for .on('typeahead:autocomplete') at a later time.

---

EDIT: There are no errors in the console, and putting console.log(mySource); right after the bloodhound object creation produces a bloodhound object:

First in your js set up the Bloodhound:

var dataSetBloodhound = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    local: data
});

Where data is the suggestion list in an array.
Mine for example is

data = [ { name: "Foo", url: "/bar.jpg" }, etc, etc ]

this is why I use name in Bloodhound.tokenizers.obj.whitespace('name') because I want my suggestions to be the name in the data array.

In my html I have my input:

<input id="quick-search-input" type="text" class="form-control" placeholder="Products" data-provide="typeahead"/>
//The important thing here is 'data-provide="typeahead"'

Which is the input that the suggestion box will act upon.

Then setting up the js behind it:

$('#quick-search-input').typeahead({
    hint: true,
    highlight: true,
    minLength: 1
},
{
    name : 'NameForFormInput',
    displayKey: 'name',
    templates:
    {
        suggestion: function(data)
        {
            return '<li class="list-group-item">
                    <p class="predictionText">'+data.name+'</p></li>';
        }
    },
    source : dataSetBloodhound
});

I think this is where you are going wrong as I had a similar issue when setting it up but fixed it when I implemented a template. Also the css will be different depending on what your using.