Stop Column Resizing in Progress?

[Brian Azzi]

Hi all,

I have several grids which are automatically refreshing their data every 10 seconds via various methods (some radajax, some client binding via a web service call). The problem I'm running into is that if the user is in the middle of a column resize event (mouse is down and he's dragging a column), when the data refreshes, its creates an error state. In this case, the column resize image freezes along with the tool-tip and stays on the screen indefinitely until the page is reloaded.

So my question is this: is it possible to abort the current resize in progress type event prior to updating the grid data? ... or, alternatively, is it possible to capture the start of the resize so that I can stop my refresh timer? (OnResizing only fires on the client on mouseup of the resize).

Thanks in advance!
-Brian

[Marin]

Hi Brian,

 The standard way to cancel the resizing is indeed the OnColumnResizing client-side event. It fires on mouse up only if the real time resizing is turned off. So if you enable it the event will fire continuously while you are resizing:

<Resizing AllowRowResize="True" EnableRealTimeResize="True"></Resizing>

Let me know if you have any other questions.

Greetings,
Marin
the Telerik team

[Brian Azzi]

Ok... that works to let me turn off my data refresh, but then I noticed that if the EnableRealTimeResize is true, then OnColumnResized also fires continuously... rather than just once when the resize is done. So... is there any event I can use to signal that the resize operation is complete? Really that's all I'm looking for is to detect when they start resizing (to turn off my refresh behavior), and when they are done (to turn my refresh behavior back on).... seems like a fairly common use-case. 

[Marin]

Hi Brian,

 Another option is to handle the mousedown event and see if the mouse is over the resize handle then you are about to resize. Then when column resized is thrown (in the case of EnableRealTimeResize="false") the resize has ended:

function columnResized(sender, args)
            {
                alert("resize ended");
            }

            function pageLoad()
            {
                $telerik.$(document).bind("mousedown", function myfunction(e)
                {
                    var targ;
                    if (!e) var e = window.event;
                    if (e.target) targ = e.target;
                    else if (e.srcElement) targ = e.srcElement;

                    if (targ.title=="Drag to resize")
                    {
                        alert("resize started")
                    }
                });
            }

Regards,
Marin
the Telerik team

[Brian Azzi]

Very cool.... that looks like exactly what I need. I'll give it a try shortly... thank you.