Search not working in Bootstrap example

[jdriesen]

Hi Everybody...

Can please smb give me a hand ? I've downloaded and installed this repo. Everything works fine (i.e. dataloading, sorting) except the Search functionality. I can't make it work (and console.log doesn't give me any error at all)

Somebody having an idea ?

Feeling so dump ...

Thanks in advance for your reply,

Kind regards, Johnny

[filpineda]

I've just experienced this on a new installation which pulled vue@2.2.1, filter events are firing, but listeners are not picking it up..

My other existing project which uses vue@2.1.10 is working fine though...

[jdriesen]

Yep, that's exactly the same issue I'm having... Event is fired, but listener doesn't pick it up...

Grtz, Johnny

[filpineda]

you can try to pull specific versions for your node_modules this is my current list of working packages: vuetable-2@1.3.0 vue@2.1.10 vue-events@3.0.0 vue-loader@9.9.5 vue-resource@1.2.0 vue-template-compiler@2.1.10 laravel-elixir@6.0.0-15 laravel-elixir-vue-2@0.2.0 laravel-elixir-webpack-official@1.0.10

Hope this will get yours to work

[jdriesen]

Thanks @filpineda . Found out there is a small prob with https://github.com/cklmercer/vue-events/tree/vue-2.x More about it later on (it's only 07:45 AM here in Belgium :)

Grtz, Johnny

[ratiw]

@jdriesen Try using this.$events.listen() in the created function instead.

  data () {
    // ...
  },
  created () {
    this.$events.listen('filter-set', filterText => {
      this.moreParams = {
        'filter': filterText
      }
      Vue.nextTick( () => this.$refs.vuetable.refresh())      
    },
    this.$events.listen('filter-reset', filterText => {
      this.moreParams = {}
      this.$refs.vuetable.refresh()
      Vue.nextTick( () => this.$refs.vuetable.refresh())
    }
  }

[jdriesen]

Thanks @ratiw !! Your solution did it. (there were some brackets missing in your code, but I managed to solve this.)

Below the final solution

created() {
    this.$events.listen('filter-set', filterText => {
      this.moreParams = {
        'filter': filterText
      } // End of moreParams

      Vue.nextTick( () => this.$refs.vuetable.refresh())
    }) // End of Filter-set Listener

    this.$events.listen('filter-reset', filterText => {
      this.moreParams = {}

      Vue.nextTick( () => this.$refs.vuetable.refresh())
    }) // End of Filter-reset Listener

  }, // End of created 

Thanks again for your support.