Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
2165
New rows on top of the grid
posted

When I add a new row it is added to the end of the grid just below the last row, that is not nice because user has to scroll down to see the new row, this is awfull specially if we need to add a new child row. How to show the new added rows on top of the list? Or at least, how to set focus on the last row so user doesn't have to scroll down?

Parents
  • 17590
    Offline posted

    Hello Luis,

    Thank you for posting in our community.

    What I can suggest for scrolling to the newly added row is handling rowAdded event of igGrid. In this event you could get reference to the scroll container and scroll to the last row. For example:

    $("#grid").igGrid({

    dataSource: data,

    primaryKey: "ID",

    height: "200px",

    autoCommit: true,

    features: [{

    name: "Updating",

    rowAdded: function (evt, ui) {

    $("#grid_scroll").scrollTop($("#grid").find("tr:last").first().position().top);

    }

    }]

    });

    This will scroll to the last row, which in this case is going to be the newly added row.

    $("#grid_scroll") will get a reference to the igGrd`s scroll container which the grid uses in order to show scrollbars and render complex layouts.

    I made a small sample and I am attaching it for your reference.

    I hope you find this information helpful.

    Please let me know if you need any further assistance with this matter.

    igGridScrollToLastRow.zip
Reply Children