Available only in PRO Edition

Setting/Getting Value

Setting Value

In order to set a value for Query Builder, you can use the setValue method. This method allows setting rules and fields for filtering, as well as defining the logic of the rules usage.

You need to pass an object with the following properties to the setValue method:

  • glue - (string) the logic for combining filtering rules:
    "AND" (default) - to display records that correspond to all rules at once;
    "OR" - to show records that correspond to at least one of the rules.
  • rules - (array) a set of filtering rules with the following properties:
    • key - (string) the key that corresponds to the ID of the field;
    • value - (string,number,date) the entered value to compare the field value with;
    • rule - (string) the filter rule. See the full list of filters.
  • query - (object) an object with glue and rules (can be used instead of the first two properties);
  • fields - (array) an array of fields for filtering. Use this parameter to redefine the initially defined fields Each field object contains the properties listed below:
    • id - (string,number) the ID of the field;
    • value - (string) the value of the field;
    • type - (string) the type of the field. Can have the following values: string, number, date;
    • validate - (function) the validation rule for the input field.
$$("querybuilder1").setValue({
    query:{
        glue: "or",
        rules: [
            {
                key: "fname",
                value: "Alex",
                rule: "equal"
            },
            {
                glue: "and",
                rules: [
                    {
                        key: "age",
                        value: 90,
                        rule: "less"
                    },
                    {
                        key: "age",
                        value: 10,
                        rule: "greater"
                    }
                ]
            }
        ]
    },  
    fields:[
        { id:"fname", value:"First Name", type:"string" },
        { id:"lname", value:"Last Name", type:"string" }
    ]
});

Setting rules and fields separately

You do not have to set all properties at once. You can specify only the rules with or without glue:

// setting only the rules object
$$("querybuilder").setValue({
    glue:"and",
    rules:[
        { key:"fname", value:"Alex", rule:"equal" },
        { 
            glue:"or",
            rules:[
                { key:"age", value:90, rule:"less" },
                { key:"age", value:10, rule:"greater" }
            ]
        }
    ]
});

or only the fields array:

// setting only the fields array
$$("querybuilder").setValue({ 
    fields:[
        { id:"fname", value:"First Name", type:"string" },
        { id:"lname", value:"Last Name", type:"string" }        
    ]
});

Related sample:  Querybuilder initialization

Getting Value

You can get the value of the Query Builder via the getValue method.

var value = $$("querybuilder1").getValue();

The method returns the object with rules used for filtering. For example:

{
    glue:"and",
    rules:[
        { key:"fname", value:"Alex", rule:"equal" },
        { 
            glue:"or",
            rules:[
                { key:"age", value:90, rule:"less" },
                { key:"age", value:10, rule:"greater" }
            ]
        }
    ]
}

After you get the value set for the widget, you can convert it into the data format required by your server side.

Related sample:  Querybuilder initialization

Back to top