ItemCommand server method on RagGrid works intermittently

[Gavin]

Hello,

I have a RadGrid embedded in a RadTabStrip. This is defined in a UserControl with a RadAjaxManagerProxy. It displays content from a DB server. I have a GridButtonColumn that is defined below. Everything works fine except that when I try to delete a row by clicking on the icon it won't work initially. A second click results in a callback to the server's RgAttachments_ItemCommand appropriately. This behaviour happens consistently. I took a look at the generated code and noticed a difference in the button's clientside onclick handler

 

This following generated javascript works

if(!$find('ctl00_MainContent_ctlRqstAttachments_RgAttachmentRevision').confirm('Are you sure you wish to delete this file attachment?', event, 'ctl00_MainContent_ctlRqstAttachments_RgAttachmentRevision', 'Delete'))return false;__doPostBack('ctl00$MainContent$ctlRqstAttachments$RgAttachmentRevision$ctl00$ctl14$ctl00','')

This generated code doesn't

if(!$find('ctl00_MainContent_ctlRqstAttachments_RgAttachmentRevision').confirm('Are you sure you wish to delete this file attachment?', event, 'ctl00_MainContent_ctlRqstAttachments_RgAttachmentRevision', 'Delete'))return false;__doPostBack('ctl00$MainContent$ctlRqstAttachments$RgAttachmentRevision$ctl00$ctl12$ctl01','')

 

The column in question

                            <telerik:GridButtonColumn HeaderText="Delete" ConfirmText="Are you sure you wish to delete this file attachment?" ConfirmDialogType="RadWindow" ButtonCssClass="btn btn-outline-danger btn-sm rounded" ConfirmTitle="Delete" ButtonType="FontIconButton" CommandName="Delete" Text="Delete" UniqueName="DeleteColumn" ItemStyle-ForeColor="Red">
                                <ItemStyle HorizontalAlign="Center"></ItemStyle>
                            </telerik:GridButtonColumn>

 

Any help to resolve this is greatly appreciated

[Gavin]

I see the issue and have taken steps to resolve this you can mark this as closed

 

Thanks

[Rumen]

Thanks for the update! Glad to hear the issue has been resolved. If you have the time, feel free to share what the root cause was - it could be helpful for others in the community.

[Gavin]

The problem was that I was trying to get around some limitations to styling a button in a GridButtomColumn and removing the previous button, styling a new Button and readding it. I got rid of the code and it's working now. I'm still working on overcoming this limitation

[Rumen]

Thank you for sharing the problem and the solution!

You can use the browser's DevTools (HTML and Style Inspector) to customize the appearance of the built-in buttons by overriding their styles. 

If it helps, you might want to look also into using a RadFormDecorator. It could give you more flexibility with styling without needing to manually remove and re-add buttons.
You could also try switching to a GridTemplateColumn - it gives you more flexibility for styling the button exactly how you want. See this approach: https://www.telerik.com/forums/add-delete-button-to-each-row-in-radgrid#1966105.