How to clear the typehead after some sort of action

[baherfaragval]

Hello all.
I tried to clear the text inside the typeahead control after selecting from the list and making some action like inserting in another tabular bootstrap , but this doesn't reset the control itself it only affected the associated modeled variable.Please let me know how to handle this

<vue-bootstrap-typeahead 
  v-model="selEmployee"  class="b-form-group typehead"  size="sm" @hit="addToTable();" style="width:100%"
  :data="empEmails"/> </td><td>   <b-button size="sm" variant="success"  @click="addToTable()">

addToTable: function() {
      let that = this;
      that.list.push({that.selEmployee});
      that.selEmployee = "";
            
          
    }

[ztomaz]

this.$refs.employeeAutocomplete.inputValue = ''
You need to include ref="employeeAutocomplete" to your vue-bootstrap-typeahead component

[chriszrc]

@ztomaz's solution works, but it's totally not obvious and afaict it's also not documented-

[crocodilered]

+1: that.selEmployee = ""; is the best and logic way to clear control value.

[markspare]

I've created a pull request #38 fixing this issue so you could just do that.selEmployee = "";

[michael-robbins]

How's PR #38 going? I'd really like this behavior to be standard! :D

[alekpentchev]

Hi! It's the end of December :) How's it going?

[hamza-mashhadi]

Hi! It's January
I don't think PR has been merged still?
I cannot make it work with the standard as it should.
Still using @ztomaz solution

[mattzollinhofer]

Hey all, I'm looking to revive this project, but I haven't been able to track down the author. So, I've forked it over to here: https://github.com/mattzollinhofer/vue-typeahead-bootstrap.

I'll try to take a look at this PR soon and see if I can get it merged as it seems like there's a number of folks who need this to be fixed.

[mattzollinhofer]

I've begun merging a few fixes into my fork (https://github.com/mattzollinhofer/vue-typeahead-bootstrap) of this project that I'm actively maintaining. I'm not positive if this exact issue is addressed, but if someone can confirm either way I'd appreciate it!

You can find it on npm here: https://www.npmjs.com/package/vue-typeahead-bootstrap.

I hope this helps!

[mattzollinhofer]

@baherfaragval @hamza-mashhadi @alekpentchev @markspare

Unfortunately this repo isn't maintained any longer, but I'm actively maintaining a fork here: https://github.com/mattzollinhofer/vue-typeahead-bootstrap

I believe I've fixed this issue. If any of you have a minute to see if my most recent version resolves the issue and report back on here I'd really appreciate it!

https://www.npmjs.com/package/vue-typeahead-bootstrap

[hamza-mashhadi]

@baherfaragval @hamza-mashhadi @alekpentchev @markspare

Unfortunately this repo isn't maintained any longer, but I'm actively maintaining a fork here: https://github.com/mattzollinhofer/vue-typeahead-bootstrap

I believe I've fixed this issue. If any of you have a minute to see if my most recent version resolves the issue and report back on here I'd really appreciate it!

https://www.npmjs.com/package/vue-typeahead-bootstrap

I tried out your fork and it has solved this Issue.

My Typeahead :
<vue-bootstrap-typeahead :data="titleList" id="job_title" v-model="jobTitleSearch" :serializer="s => s.name" placeholder="Enter Job Title" @hit="selectedJob" ref="jobTitle" />
when I want to reset :
this.jobTitleSearch = "";

p.s I would suggest you update your readme about usage since the package name has changed from the original one. (it's now vue-typeahead-bootstrap instead of vue-bootstrap-typeahead)

Thank you for the fix I will be using your package from now onwards :)

[mattzollinhofer]

Thanks for checking!

Also thanks for the heads up about the readme, that’s embarrassing 😂

[mattzollinhofer]

@hamza-mashhadi Could you close this issue since we've found a solution? I'm trying to work through the old issues on this repository and I don't have control over it to close it.

[hamza-mashhadi]

@hamza-mashhadi Could you close this issue since we've found a solution? I'm trying to work through the old issues on this repository and I don't have control over it to close it.

Sadly I can't, @baherfaragval opened the issue so only he or repo owner can close this.

[mattzollinhofer]

Ugh, sorry,I wasn’t paying close enough attention. Thanks anyway.