moukbel
7 months ago
34
1
Vue

Table Filter & Sorting !!

Posted 7 months ago by moukbel

hi, i want to build a table with sorting and box filter,

i have array of 4 records type { id , name, price, product} how i can make the filter search in all the records, not just one of them

table building:

 <thead class="thead-dark">
                  <tr>
                      <th style="width:5%" @click="sortby('id')"> ID</th>
                      <th style="width:50%" @click="sortby('name')">Name</th>
                      <th style="width:5%" @click="sortby('price')">Price</th>

                  </tr>
                </thead>

                <tbody >
                    
                      <tr v-for="card in orderedProducts " :key="card.id">
...... etc

computed:

  computed: {
            orderedProducts: function () {
                const vm = this;
                return _.orderBy( vm.filterby , [vm.sortKey,vm.search], ['asc'])
            },

            filterby: function () {
                 const vm = this;

                 return vm.categories.filter(function (product) {
                        return product.price.indexOf(vm.search)  !== -1

               })
       
            },



Please sign in or create an account to participate in this conversation.