Forums Retired Products and Controls
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
Vijay Jaiswal
95
How to change style for WebTextEdit on Focus
posted

Hi,

Could anyone help me please? I have defined four css class named TextBoxEditable,TextFocusHighlight,TextBoxHoverHighlight & TextBoxDisabled for my WebTextEdits. How can I change from style TextBoxEditable to TextBoxFocusHighlight on getting focus, and again change to TextBoxEditable after focus lost.

Thanks in advance!!

Vijay

  • 24497
    posted

    Hi Vijay,

    There is no public option to define different css for different states of control. However, control exposes a lot of client side events. So, you may process them and adjust properties of editor. Example below uses "elem" member variable which is the reference to actual <input> used by control.

    <style type="text/css">
    .css1{background:red;}
    .css2{background:cyan;}
    </style>
    <    script type="text/javascript">
    function     WebDateTimeEdit_Blur(oEdit, text, oEvent)
    {
     oEdit.elem.className =     'css2';
    }
    function WebDateTimeEdit_Focus(oEdit, text, oEvent)
    {
     oEdit.elem.className =     'css1';
    }
    </script>
    <igtxt:WebDateTimeEdit ID="WebDateTimeEdit" runat="server">
         <ClientSideEvents Blur="WebDateTimeEdit_Blur" Focus="WebDateTimeEdit_Focus" />
    </igtxt:WebDateTimeEdit>