CODEWITHSUNDEEP
jqueryjquery-autocompletetwitter-bootstrap-3bootstrap-typeahead
pee2pee
pee2pee

Reputation: 3792

jQuery Autocomplete / Twitter Typeahead Populate Multiple Fields

I'm currently using TypeAhead (Bootstrap) but happy to use jQuery Autocomplete to accomplish what I need

I have 5 input fields. I also have a table structured as below so I'll be using a remote datasource:

Classification   | Model | Cost  | Depreciation  | Warranty
-----------------------------------------------------------
Laptop/PC/Server | X/Y/Z | 1/2/3 | 1/2/3/4/5/6/7 | 1/2/3

So there are multiple values for each column. A laptop can only have certain models attributed to it

Question One

Let's say I choose "Laptop" for an autocomplete field, is there anyway to refine the "Model" field to pick out only those models attributed with the chosen laptop?

Question Two

In the first instance, let's presume the above isn't possible. Let's say I chose "Laptop" from the autocomplete field for "Classification". I then go to the "Model" autocomplete field and choose for example "Latitude D830". Is there anyway I can then populate the Cost/Depreciation/Warranty field automatically?

Let's now say the first question is possible. What's the best way to combine the two? The current TypeAhead initialisation is pretty vanilla

$('#inputClassification').typeahead([
        {
            name: 'classification',
            local: ["Tablet", "PC", "Laptop", "Phone", "Printer", "Switch", "Router", "Firewall", "Wireless AP", "Wireless Controller", "Server", "Storage"]
        }
        ]);

Thanks!

Upvotes: 1

Views: 2923

Answers (1)

pee2pee
pee2pee

Reputation: 3792

Seems something along these lines seems to work

       $('#inputLocationStatus').typeahead({
            name: 'poiuy',
            prefetch: 'js/names.json',
            ttl:0                                                             
        }).on('typeahead:selected', onSelected);

        function onSelected($e, datum) {
            $('#inputDepartment').val(datum['description']);
        }

Upvotes: 4

Related Questions