Open list on focus

Jhonatan Sandoval picture Jhonatan Sandoval · Jul 2, 2014 · Viewed 8.5k times · Source

I work with the angular bootstrap ui (typeahead) trying to show the list of my customers when the inputs is focused, with this:

lima3app.directive('typeaheadOpenOnFocus', function() {
    return {
        require: ['ngModel'],
        link: function(scope, element, attr, ctrls) {
            element.bind('focus', function() {
                ctrls.$setViewValue('');
                console.log('customer.customer');
            });
        }
    };

});

So in the view i setted my input:

<input type="text" class="form-content req" id="form-customer"
       name="formcustomer"
       typeahead="customer as customer.customer for customer in customerList | filter:{customer:$viewValue}"
       typeahead-on-select="onCustomerSelect($item)"
       typeahead-append-to-body="true"
       typeahead-open-on-focus

       ng-model="customer.customer"
       focus="true"
       required="required">

But the code, doesn't work. Is there any way to do this?

Answer

Jeson Martajaya picture Jeson Martajaya · Sep 17, 2016

Thanks to @HenryNeo in locating the correct attribute that UI Bootstrap accepts. The following code is working for me , for angular-ui Bootstrap 1.3.3.

Use uib-typeahead to enable the dropdown and typeahead-min-length (without uib-) to enable the minLength attribute.

<input type="text" typeahead-min-length="0" uib-typeahead="t for t in timeZoneList">