search

[qlf123]

Table can be field search

[ratiw]

@qlf123 .. ??? .. What do you mean???

[ojnavi32]

Hello. I almost got it all working except on the search. Im getting this error when trying to search "Uncaught ReferenceError: n is not defined". I hope you can help me with this

[ratiw]

@ojnavi32 You need to give me more information. If I have to guess, it probably be somewhere in your code that reference to variable n that is not defined.

[ojnavi32]

I am using laravel 5.3 and I created a component for the vuetable. I used the twitter bootstrap codes of yours its working fine but the search is not working. My api is based on the code on your sample data using laravel.

[ratiw]

Do you know if the error happens on the client side or the server side? At least you need to know this first. The error might be in your javascript (client side) or in php (server side).

My example code does not contain any n variable.

[ojnavi32]

Thank you for your help. I think the problem is in the client side in my js because I can filter in my api.

Can you explain sir how are you doing on setFilter method. Is there any other method to replace the codes in the function, any other methods?

[ratiw]

It only appends filter parameter to the query string that will be appended to the api-url. searchFor is a textbox that you enter the filter string. moreParams is bound to vuetable's append-params prop. vuetable:refresh is the event that asks vuetable to reload the data using the current parameters.

            setFilter: function() {
                this.moreParams = [
                    'filter=' + this.searchFor
                ]
                this.$nextTick(function() {
                    this.$broadcast('vuetable:refresh')
                })
            },

[diskman]

@ratiw I try to use :append-params="$store.state.t.searchParams" to bind search criteria object but it doesn't work when executing event this.$refs.vuetable.refresh(). Is there any method to bind search criteria with store ( I use vuex)?

[ratiw]

@diskman I don't use vuex myself, so I'm not sure. And, no, there is no method in vuetable that will bind search criteria with store. In my opinion, binding search criteria directly to vuex looks kind a weird.

But have you try using computed function instead of referencing the $store directly in your template?

[diskman]

@ratiw because I use vue 2.0 version I was not able to use

 this.$nextTick(function() {
                    this.$broadcast('vuetable:refresh')
                })

I have used

this.moreParams = this.$store.getters.searchParams
...
this.$refs.vuetable.refresh()

It is ok, but now I am not able to construct moreParams object with array eg { criteria1: 0 criteria2: [ 3, 4, 5 ] }

because [] is encoded into 2%5B%5D

[ratiw]

@diskman Ah, you're using vuetable-2. I'm a little bit confuse on what problem you're trying to solve then.

By the way, append-params is an object, you cannot assign an array to it.

[diskman]

@ratiw sorry for confusion, I try to get it more clear here - "supporting append-paramas object containing array type property"