Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Typeahead auto-open on init #157

Open
ilvalerione opened this issue Oct 16, 2017 · 2 comments
Open

Typeahead auto-open on init #157

ilvalerione opened this issue Oct 16, 2017 · 2 comments

Comments

@ilvalerione
Copy link

Hello,
I'm binding Typeahead with v-model to my internal variable.


But when I declare a default value for val.country Typeahead open automatically the drop down list. I think because the plugin finds a "changed" event of the input value.

Is there a way to close programmatically the dropdown list or to block this behavior?

immagine

@ghost
Copy link

ghost commented Nov 10, 2017

I had that issue, I set the limit to zero initially and then when someone types I change limit to 4. Sorta acts as a disable initially and reenable when someone types.

<div class="col-xs-5" v-on:keyup="enableTypeahead">
            <label for = "name">Style</label>              
            <typeahead                 
                v-model="beer.style.stylename"
                placeholder="Style" 
                async-key="data" 
                :async="getAsyncStyleUrl" 
                :template="asyncStyleTemplate" 
                :on-hit="callBackStyle"
                :limit="typeaheadLimit">
            </typeahead>             
        </div>
data (){
        return {
            asyncStyleTemplate: '{{ item.stylename }}',
            typeaheadLimit: 0
        }
    }
enableTypeahead() {
            this.typeaheadLimit = 4;
        }

@Pengman
Copy link

Pengman commented Jun 19, 2018

Nice workaround @tehjrow

I made it work by alterring the source (in Typeahead.vue, or the js created from it):
I added a prop to the component ( around line 35 ):

    matchStart: { type: Boolean, default: false },
    supressInitialSearch: { type: Boolean, default: false }, // added
    onHit: {

And then I changedf the created hook to respect this property (around line 125)

      if (! this.supressInitialSearch) {
          this.__update();
      }

And now the property can be added to the typeaheads when needed:

                <typeahead 
                           supress-initial-search
                           :on-hit="...">

This seems to work for me, to prevent the initial search and popup

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants