autocomplete fro tags working

This commit is contained in:
Senta Mandutz 2019-07-02 13:08:11 +02:00
parent 79475fe48d
commit a4dbafe3ef
2 changed files with 18 additions and 8 deletions

View File

@ -102,7 +102,8 @@
<b-autocomplete <b-autocomplete
rounded rounded
v-model="searchtext" v-model="searchtext"
:data="getFilteredTags" @keydown.native.enter="search"
:data="filteredDataArray"
placeholder="suche..." placeholder="suche..."
icon="magnify" icon="magnify"
@select="option => selected = option"> @select="option => selected = option">
@ -205,16 +206,26 @@
el: '#api', el: '#api',
data: function() { data: function() {
return{ return{
searchtext: "ipsum", searchtext: "",
selected: [], selected: [],
taglist: dat, taglist: dat,
}; };
}, },
computed:{
filteredDataArray() {
return this.taglist.filter((option) => {
return option
.toString()
.toLowerCase()
.indexOf(this.searchtext.toLowerCase()) >= 0
})
}
},
methods: { methods: {
search: function() { search: function() {
console.log("Searchtext: " +this.searchtext + tagArray); console.log("Searchtext: " +this.searchtext.replace(/#/g,''));
$.ajax({ $.ajax({
url: "api/msg/search/" + this.searchtext, url: "api/msg/search/" + this.searchtext.replace(/#/g, ''),
method: "GET" method: "GET"
}).done(jd => { }).done(jd => {
// NICHT SO wg. Vue: _messagelist = jd; // NICHT SO wg. Vue: _messagelist = jd;

View File

@ -5,9 +5,8 @@ Vue.component('MsgCard', {
<img src="favicon.ico" width=20px height=20px> <img src="favicon.ico" width=20px height=20px>
</h6> </h6>
{{ msg.message }}<br><br> {{ msg.message }}<br><br>
<div v-for="tag in msg.tag"> <a v-for="tag in msg.tag" href="#">#{{ tag }} </a>
<a href="#">{{ tag }}</a> </p>
</div></p>
<div class="om-card-footer"> <div class="om-user-line"> <div class="om-card-footer"> <div class="om-user-line">
<i class="material-icons">account_circle</i> <i class="material-icons">account_circle</i>
Erstellt von {{ msg.user }}</div> Erstellt von {{ msg.user }}</div>