Bootstrap: typeahead request, load custom datasource

For http://stackoverflow.com/questions/15402768/bootstrap-typeahead-with-ajax-source-not-returning-array-as-expected/15435553#15435553

by bmarsh123

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="muted">This example shows how to async fetch autocomplete data that is not structured
    as a list of strings. It shows how to map the text for the type ahead to
    an id from the source data. When an item is selcted, the corresponding
    id is show in the adjacent textbox.</div>
<div class="container">
    <input id="lookup" type="text" />
    <input id="selectedId" type="text" readonly="readonly" />
    <input id="id2" type="text" readonly="readonly" />
</div>
<div id="jsonSource" class="muted">Json source used in this example (I suggest typing an 'L'):</div>

CSS

@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
 @import url('http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css');
 .container {
    margin-top: 10px;
}

JavaScript

// source url, in question: var lookupUrl =  ROOT+'Record/checkCompanyName'
var lookupUrl = '/echo/json/';

// used to get the name o
var nameIdMap = {};

$('#lookup').typeahead({
    source: function (query, process) {
        return $.ajax({
            dataType: "json",
            url: lookupUrl,
            data: getAjaxRequestData(),
            type: 'POST',
            success: function (json) {
                var results = json.map(function(item) {
                    var someItem = { id: item.id, score: item.score, name: item.name };
                    return JSON.stringify(someItem.name);
                });
                return process(results);
            }
        });
    },
    minLength: 1,
    updater: function (item) {
        var obj = JSON.parse(item);
        return item;
    }
});

$('#jsonSource').append($('<code>').append(getJsonData('')));

function getOptionsFromJson(json) {
    $.each(json, function (i, v) {
        nameIdMap[v.name] = v.id;
    });

    return $.map(json, function (n, i) {
        return n.name;
    });
}

function getAjaxRequestData(query) {
    return {
        json: getJsonData(query),
        delay: 1
    };
    // in the question this would be:
    // return 'q='+query;
}

// data from the question
function getJsonData(query) {
    return JSON.stringify(
    [{
        "id": "1265",
            "score": "40",
            "name": "LMV AB"
    }, {
        "id": "10834",
            "score": "33",
            "name": "Letona"
    }, {
        "id": "19401",
            "score": "33",
            "name": "Lewmar"
    }, {
        "id": "7158",
            "score": "33",
            "name": "Lazersan"
    }, {
        "id": "3364",
            "score": "33",
            "name": "Linpac"
    }, {
        "id": "1216",
            "score": "33",
            "name": "L H Evans Limted"
    }, {
        "id": "1",
            "score": "33",
            "name": "LH Evans Ltd"
    }, {
        "id": "7157",
           ...