[Solved] change RadTextbox(Telerik textbox) and RadDatePicker(Telerik DatePicker) background color using jquery or Javascript

[Jayesh V]

Hi,
 
I have to change background colors of RadTextbox and RadDatePicker

how to change RadTextbox(Telerik textbox) and RadDatePicker(Telerik DatePicker) background color using jquery or Javascript?


Thanks,
Jayesh Varu

[Princy]

Hello Jayesh,

You can try the following javascript to set the background color.

ASPX:

<telerik:RadDatePicker ID="RadDatePicker1" runat="server">
  <DateInput ClientEvents-OnLoad="changebk">
  </DateInput>
  </telerik:RadDatePicker>
  <telerik:RadTextBox ID="RadTextBox1" runat="server" ClientEvents-OnLoad="Load">
</telerik:RadTextBox>

JS:

<script type="text/javascript">
 function changebk(sender, args)
{
  sender.get_styles().EnabledStyle[0] += "background-color: red;";
  sender.updateCssClass();
}
 function Load(sender)
{
  sender.get_styles().EnabledStyle[0] += "background-color: red;";
  sender.updateCssClass();
}
</script>

Thanks,
Princy.

[Jayesh V]

Thanks Princy,

    But i want it on some external event fire not on the ClientEvents-OnLoad.

     Suppose one html input press then I want to change Background.

Thanks
Jayesh Varu

[Shinu]

Hello Jayesh,

You can try the following code snippet.

ASPX:

<asp:Button ID="Button" runat="server"  OnClientClick="click1();return false;" Text="click" />
<telerik:RadDatePicker ID="RadDatePicker1" runat="server">
</telerik:RadDatePicker>
<telerik:RadTextBox ID="RadTextBox1" runat="server">
</telerik:RadTextBox>

JS:

<script type="text/javascript">
function click1()
 {
    var picker = $find("<%= RadDatePicker1.ClientID %>");
    var textbox = $find("<%= RadTextBox1.ClientID %>");
    textbox.get_styles().EnabledStyle[0] += "background-color: red;";
    textbox.updateCssClass();
    picker.get_dateInput()._textBoxElement.style.backgroundColor = "yellow";
 }
</script>

Thanks,
Shinu.