bug fix: sapi search form: term from autocomplete was not cleaned when typed was changing in field

This commit is contained in:
Bachir Soussi Chiadmi 2021-02-24 15:33:27 +01:00
parent 256d4dbf1c
commit 30998980ca
3 changed files with 83 additions and 8 deletions

View File

@ -31,7 +31,7 @@ class MaterioSapiSearchForm extends FormBase {
'#attributes' => [ '#attributes' => [
"placeholder" => $this->t('Search'), "placeholder" => $this->t('Search'),
// "@keyup" => "keyup", // "@keyup" => "keyup",
"@keyup.enter" => "submit", // "@keyup.enter" => "submit",
"v-model" => "typed", "v-model" => "typed",
"v-focus" => "", "v-focus" => "",
// "v-on:select" => "typed", // "v-on:select" => "typed",

File diff suppressed because one or more lines are too long

View File

@ -25,7 +25,7 @@ export default {
}, },
methods: { methods: {
submit() { submit() {
console.log("search clicked", this.typed, this.autocomplete); console.log("search submited", this.typed, this.autocomplete);
// New search is triggered by Base.vue with router (which will also fill the store) // New search is triggered by Base.vue with router (which will also fill the store)
this.$router.push({name:'base', query:{keys:this.typed,term:this.autocomplete}}) this.$router.push({name:'base', query:{keys:this.typed,term:this.autocomplete}})
// this.$router.push({ // this.$router.push({
@ -35,9 +35,16 @@ export default {
}, },
onAutoCompleteSelect(event, ui){ onAutoCompleteSelect(event, ui){
event.preventDefault(); event.preventDefault();
// console.log('autoCompleteSelect', event, ui); console.log('autoCompleteSelect', event, ui);
this.typed = ui.item.label this.typed = ui.item.label
this.autocomplete = ui.item.value setTimeout(function(){
console.log('update autocomplete value after settimeout');
this.autocomplete = ui.item.value
if(this.typed !== this.keys && this.autocomplete !== this.term){
this.submit()
}
}.bind(this), 1)
} }
}, },
directives: { directives: {
@ -60,12 +67,17 @@ export default {
} }
}, },
watch: { watch: {
typed(n, o){
console.log('typed changed', o, n);
// is changed also when autocomplete change it ...
this.autocomplete = null
},
keys(n, o){ keys(n, o){
console.log('keys changed', n, o); console.log('keys changed', o, n);
this.typed = n this.typed = n
}, },
term(n, o){ term(n, o){
console.log('autocomplete changed', n, o); console.log('autocomplete changed', o, n);
this.autocomplete = n this.autocomplete = n
} }
}, },