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.