CommandItemSettings AddNewRecordButton and CSS

6 posts, 1 answers
  1. Dimitrios
    Dimitrios avatar
    45 posts
    Member since:
    Jun 2014

    Posted 17 Jul 2014 Link to this post

    There are only two settings I can set from the aspx file for the AddNewRecord Button of a radgrid (when it's visible).

    CommandItemSettings-AddNewRecordText
    CommandItemSettings-AddNewRecordImageUrl

    ...but this is not enough.


    Is there a way to control the appearance of the add button with css?


    I can do this for the edit button (for example) of each row by:

          Dim ImgBtn As ImageButton = DirectCast(e.Item.FindControl("EditCommandColumn"), ImageButton)
          ImgBtn.CssClass = "editbutton"

    ...in the itemCreated event.

    Thanks
  2.
  3. Answer
    Jayesh Goyani
    Jayesh Goyani avatar
    2733 posts
    Member since:
    May 2010

    Posted 17 Jul 2014 in reply to Dimitrios Link to this post

    Hi,

    Please try with the below code snippet.

    As per my knowledge there is not such type of property is there but you can assign CSS property by using below code snippet.
    because for add button there are two DOM elements created.

    <style type="text/css">
            .RadGrid .rgAdd + a
            {
                //Add button text related css
            }
            .RadGrid .rgAdd
            {
                //Add button image related css
            }
        </style>

    Do not forgot to add "!important" in CSS property.

    Let me know if any concern.

    Thanks,
    Jayesh Goyani
  5. Dimitrios
    Dimitrios avatar
    45 posts
    Member since:
    Jun 2014

    Posted 21 Jul 2014 in reply to Jayesh Goyani Link to this post

    Thanks Jayesh,

    That's exactly what I wanted!
  7. Mark
    Mark avatar
    7 posts
    Member since:
    Nov 2018

    Posted 27 Feb 2019 Link to this post

    This is useful and will work but it would be better to be able to apply a css class directly to the button instead of overwriting the css classes that are being auto-injected.  In most cases you will already have your button classes defined and using this approach means that the css has to be duplicated and separately maintained. 
  8.
  9. Mark
    Mark avatar
    7 posts
    Member since:
    Nov 2018

    Posted 27 Feb 2019 Link to this post

    This recommendation does work, but it would be better to be able to specify/add your own CSS class names to these buttons as most people will already have their button CSS well defined in their own classes.  Using this approach means you have to maintain a second copy of those button styles in a separate class. 
  11. Marin Bratanov
    Admin
    Marin Bratanov avatar
    5819 posts

    Posted 04 Mar 2019 Link to this post

    Hi Mark,

    There is always the option to define your own command template where you can use the desired markup and classes. You can read more about the options and handling that in the following article: https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/data-editing/commanditem/command-item-template.


    Regards,
    Marin Bratanov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top