jQWidgets jqxGrid VerticalScrollBarStep Property

The VerticalScrollBarStep property of jQWidgets jqxGrid is used to set the number of rows that should be scrolled up or down when the user interacts with the vertical scrollbar control. By default, the value of this property is set to 25.

Syntax

The syntax of the VerticalScrollBarStep property is as follows:

$(selector).jqxGrid({verticalScrollBarStep: value});

Here,

• selector: It is a required parameter that defines the HTML element to bind the jqxGrid control.
• value: It is an optional parameter that represents the number of rows to be scrolled when the user interacts with the vertical scrollbar control.

Example

$(document).ready(function () {
    // Initialize jqxGrid
    $("#grid").jqxGrid({
        columns: [
            {text: 'Name', datafield: 'name', width: 200},
            {text: 'Country', datafield: 'country', width: 200},
            {text: 'Population', datafield: 'population', width: 200},
        ],
        source: dataAdapter,
        pageable: true,
        autoheight: true,
        virtualmode: true,
        rendergridrows: function () {
            return dataAdapter.records;
        }
    });

    // Set the VerticalScrollBarStep to 50
    $("#grid").jqxGrid({verticalScrollBarStep: 50});
});

In this example, we have set the VerticalScrollBarStep property of jqxGrid to 50. This means that whenever the user interacts with the vertical scrollbar control, the grid will scroll up or down by 50 rows.

Conclusion

The VerticalScrollBarStep property of jQWidgets jqxGrid is an important property that can be used to customize the behavior of the vertical scrollbar control. By modifying this property, you can set the number of rows that should be scrolled when the user interacts with the vertical scrollbar control.