How to give active style to button ?

2 posts, 0 answers
  1. Prava kafle
    Prava kafle avatar
    204 posts
    Member since:
    Apr 2010

    Posted 23 Jul 2010 Link to this post

    I have few Buttons in my application and I want them to have a default color style, hover style and active style.  When the user clicks the button, I want it to  have a red background untill the request is processed and changes are made in the aplication.Using FormDecorator I could only implement hover style and default style but not active style. Is it possible to style button with certain background untill request is ended?

    I donot want to use progress bar to let the user know that request is being processed, I just want the button to have a different color when it is in active phase.

    Any Idea?

  2. Bozhidar
    Bozhidar avatar
    677 posts

    Posted 27 Jul 2010 Link to this post

    Hi Prava,

    To have red colored button, you should create a custom RadFormDecorator skin. You could find useful the following resource: Creating RadFormDecorator Custom SKin.

    ButtonSprites.gif, which is used to decorate the buttons in RadFromDecorator, decorates three states of the button: the normal state, the hovered stat,e and the clicked state.

    For your convenience I have created a new ButtonSprites.gif, based on the Default skin sprite image, where the clicked state will colorize the button in red. I have also added an additional selector in the CSS: rfdClickedButtonActive, and a little piece of JavaScript code that applies that class to the input and the input wrapping element after the button is clicked, and you will have that red background color. Probably it will be necessary to edit a little the image and the script to cover your specific behavior.

    Attached is containing the edited sprite image, new CSS selectors and JavaScript code.

    Kind regards,
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. DevCraft R3 2016 release webinar banner
Back to Top