Forums Ignite UI for jQuery
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
Close
Ben Dekeyser
335
igGrid - Swap button position in Row Edit Dialog
posted

Hi,

I was wondering if it's possible to change the button layout of the editor dialog as demoed here:

https://www.igniteui.com/grid/customize-updating

We would like to have the Done button on the right so that it aligns with the rest of our UI and doesn't confuse our users.

Parents
No Data
Reply
  • 200
    Verified Answer
    Offline posted

    Hello,

    Changing positions of the “Done” and “Cancel” buttons in row edit dialog can be achieved by handling rowEditDialogAfterOpen event, fired when dialog box is opened and all dom elements are rendered. In this handler the DOM should be manipulated to reorder the dialog elements.

    For example, if positions of “Done” and “Cancel” buttons should be swapped the after jQuery method can be used. For example:

    rowEditDialogAfterOpen: function(evt, ui) {

    $("#grid1_updating_dialog_container_footer_buttoncancel").after($("#grid1_updating_dialog_container_footer_buttonok"));

}

    More about the jQuery after function can be found here.

    Attached you can find a sample that swaps the two buttons. In case this is not a correct representation of what you are trying to achieve feel free to correct me.

    editDialogDoneButtonSample.zip

Children