Click and selecting rows in jqxgrid should fire the scroll.

[sam8uhgParticipant]

Hello I came upon a use case where I need to implement some changes in jqxgrid that whenever user starts selecting rows by hovering through mouse the scroll should also move so can someone suggest whether there is any by default functionality for that or else we need to make addintions in mousedown and mouseover events and then trigger the scroll.
Thanks!

[HristoParticipant]

Hello sam8uhg,

I need more details about what you want to achieve.
You could use the scrolloffset and the scrollposition methods of the jqxGrid will help.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[sam8uhgParticipant]

Hello Hristo,
I will try to describe the use-case.So, first off all we have a jqxgrid which has multiple rows.So what I needed to implement was that whenever I start selecting row by hovering the mouse keeping the left mouse button pressed, this should automatically lead to scrolling of the scrollbar of the grid.I guess there is a overflow-y css property which when set to scroll allows the scroll to move upon overflow.
So if you think of an approach that how can I bind the scrolling of grid to the mouse selection event then please suggest.Also do u think this use-case can be achieved or not or is it a by default issue that cannot be changed.Please share ur thoughts.
Below are some lines of code i was trying to add but was not feasible it sometimes worked and not the other time :
$(“#jqxgrid”).mousedown(function (e) {//capturing mousedown event
if (e.which === 1 && $(“#jqxgrid”).mouseover()) {//trying to capture two events left click and mouse hovering
/* left mouse button was clicked! */
console.log(“hey left button!!”);
console.log($(‘#jqxgrid’).jqxGrid(‘scrollposition’));

//trigger the scroll to move by setting css property.
$(“#contenttablejqxgrid”).css(“overflow-y”, “scroll”);
}
});
Thanks for replying!!

Regards
Samiran

[HristoParticipant]

Hello Samiran,

There is no such built-in feature, unfortunately.
One of the possible options is to use the pressed “Shift” key and with scrolling to change the visible rows then click on the new view.

Another option is provided from our Smart HTML Elements library.
There you could select one row and while the left button stays pressed to move the cursor below (for example) to select the next rows.
Please, take a look at this demo.
Try the “Extended Selection” option.
I hope this will help.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[sam8uhgParticipant]

Hello,
Thanks for suggesting the above methods.I will try implementing the suggested workarounds.
Regards
Samiran

[sam8uhgParticipant]

Hello,
Is it possible to consume the Smart HTML Elements library with the existing JqxGrid?
Thanks
Samiran

[HristoParticipant]

Hello Samiran,

Yes, they are compatible.
Also, please, take a look at this forum topic:
https://www.jqwidgets.com/community/topic/smart-elements/
Please, let me know if you have any other questions.

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[sam8uhgParticipant]

Hello ,
So if we want to use jqxgrid with Smart.js we will first have to download the package then render it in our html file and then comes the question how are we gonna use Smart library is it like this..
window.Smart(‘#idofJqxgrid’).
If not this then could u please suggest an example of using smart with jqxgrid.
Thanks
Samiran

[HristoParticipant]

Hello Samiran,

I suggested to you an example for you from the Smart HTML Elements library.
Which provides the new “Extended Selection” feature.
The other mentioned thing is the forum topic where is mentioned our Theme Builder.
There you could find a combination from both libraries:
https://www.jqwidgets.com/themebuilder/

Best Regards,
Hristo Hristov

jQWidgets team
https://www.jqwidgets.com

[Author]

Posts