client event after reordering colum

6 posts, 0 answers
  1. Paul Evers
    Paul Evers avatar
    52 posts
    Member since:
    Oct 2011

    Posted 12 Apr 2012 Link to this post

    I am using version Q1 2012 of the ASP.NET AJAX Controls.
    I want to create a client-event where I register the column that has been moved and the position it has been dragged to.

    I have created clientevents for OnColumnMovedToLeft and for OnColumnMovedToRight.

    Within these events I can read 
    eventArgs.get_gridColumn()
    This is not the column that has been dragged.
    How do I get the correct dragged column with it's new position?
    
    Paul
  2. Antonio Stoilkov
    Admin
    Antonio Stoilkov avatar
    530 posts

    Posted 17 Apr 2012 Link to this post

    Hi Paul,

    You could achieve your scenario by subscribing to RadGrid ColumnSwapping or ColumnSwapped events. In the handler access the source and target columns through the event arguments as it is shown below.
    <ClientEvents OnColumnSwapping="ColumnSwapping" OnColumnSwapped="ColumnSwapped" />

    function ColumnSwapping(sender, eventArgs)
    {
        var sourceColun = eventArgs.get_gridSourceColumn();
        var targetColumn = eventArgs.get_gridTargetColumn();
    }
     
    function ColumnSwapped(sender, eventArgs)
    {
        var sourceColun = eventArgs.get_gridSourceColumn();
        var targetColumn = eventArgs.get_gridTargetColumn();
    }

    Kind regards,
    Antonio Stoilkov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Paul Evers
    Paul Evers avatar
    52 posts
    Member since:
    Oct 2011

    Posted 17 Apr 2012 Link to this post

    I cannot use this when I use the following reorder-method:
    ColumnsReorderMethod="Reorder"
    
    Paul
  5. Antonio Stoilkov
    Admin
    Antonio Stoilkov avatar
    530 posts

    Posted 20 Apr 2012 Link to this post

    Hello Paul,

    I have assembled a sample project demonstrating the desired functionality using ColumnsReorderMethod="Reorder" and OnColumnSwapping and OnColumnSwapped client-side events. You could take a look at the provided video below. Could you please further explain why you can not use these methods with ColumnsReorderMethod="Reorder".

    All the best,
    Antonio Stoilkov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  6. Paul Evers
    Paul Evers avatar
    52 posts
    Member since:
    Oct 2011

    Posted 20 Apr 2012 Link to this post

    Hello Antonio,

    I thought that OnColumnSwapping and OnColumnSwapped only was triggered when ColumnsReorderMethod was set to Swap.
    Now I notice that when I move a column e.g. 5 positions the OnColumnSwapped-event is called 5 times.
    As I want to sent the new positions of the column via a wcf-service to the server, this is not quit efficient (I am using the GridSettingsPersister). Also when I send the swapped column-positions to the server on each event-occurance the column-order-information get messed up at the server-side.

    Paul
  7. Antonio Stoilkov
    Admin
    Antonio Stoilkov avatar
    530 posts

    Posted 25 Apr 2012 Link to this post

    Hello Paul,

    I have updated the provided project in order to achieve the desired functionality. The idea is to set a timeout which checks if recently a ColumnSwapped event is called and if not execute your logic sending the sourceColumns and targetColumns arrays to the server by making only one request.
    var sourceColumns = [];
    var targetColumns = [];
    var isColumnSwappedCalled = false;
    function ColumnSwapped(sender, eventArgs) {
        var sourceColumn = eventArgs.get_gridSourceColumn();
        var targetColumn = eventArgs.get_gridTargetColumn();
        sourceColumns.push(sourceColumn);
        targetColumns.push(targetColumn);
        isColumnSwappedCalled = true;
        setTimeout(function ()
        {
            if (isColumnSwappedCalled)
            {
                //send the sourceCoulumns and targetColumns to the server with only one request
            }
            isColumnSwappedCalled = false;   
        }, 10);
                 
    }

    Greetings,
    Antonio Stoilkov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017