refresh method on ui.query doesn't work

I need to dynamically change the properties of the ui.query widget.
But when I try to update it after changing the properties, I get the error "TypeError: refresh is not a function."
How do I get my ui.query to appear with the new properties?
Thank you


  • edited September 2

    Hello @UnoCasa ,

    The Query widget does not have the usual public API, which is why you won't be able to call define()+refresh() methods directly the widget in the same way you customize the standard Webix widgets. This is due to the fact that this widget was built using Webix Jet, and requires a completely different approach when working with it.

    All settings that are not included in the "reactive config" are used only at the time of initialization. What is reactive config is explained in the chapter from File Manager.
    Query value is a specific reactive property, which means that you can get and set its value as well as listen to its changes through the components state. To get the value property call the getState() method and then access the "value" property of the resulting object:

    $$("query").getState().value; // an object with filtering rules or null

    So you can get the app and change the url, at the same time tidying up the initial settings (although this does not affect anything):

    As alternative solution, you can create webix.copy() of config and then use webix.ui() constructor to redraw Query. Please check the next snippet:

    I also recommend taking a look at the following article explaining our choice and introducing more ways you can work with Jet-based widgets (including Query) - As for the Query widget in particular, I recommend taking a look at the corresponding chapter of our documentation for any extra information that may help you out -

  • Hello @annazankevich,
    thank you for your suggestions; I actually need to dynamically change the fields property, but when I rebuild the query widget I can no longer get the value through $$("query").getState(). Thanks.

  • edited November 1

    Hello @UnoCasa ,

    Further tests showed that dynamic UI replacement is not applicable here, sorry for misguiding you. Please use the 1st option (showing the relevant mode through the $app URL).

    To change the fields, modify them in $app.config.
    Please take a look at the snippet:
    In such case, you'll also need to get "reactive config" (state) and reset value before changing fields (q.getState().value = null) to avoid any inconsistency.

  • Hi @annazankevich, with your suggestions I solved the problem.
    Thank you very much

Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!