[Solved] How can I change text color?

[Nim]

Hello,

In my view, I have:

<%= Html.Telerik().IntegerTextBox()
                             .Name("test")
                             .InputHtmlAttributes(new {style="width:30px;text-align:right"})
                             .Spinners(false).EmptyMessage("")  %>

Then I'm trying to write a Javascript to change the text color.  I've tried:

$("#test").data("tTextBox").element.style.color = "#336699";

but it's not working properly.

I wonder how I may change text color using Javascript?

Thank you!

[Dimo]

Hello Nim,

The tricky part in your scenario is that the NumericTextBox element consists of two elements - a textbox, which holds the real value, and a <div>, which holds the formatted value. The <div> is visible when the textbox is blurred. The textbox text is hidden when the textbox is blurred.

In order to change the text color while the component is blurred, please use:

$("#test").parent().find(".t-formatted-value").css('color', 'red');

In order to change the text color while the component is focused, please use your current approach plus the above line.

By the way, in order to have a right-aligned textbox, I recommend using the following:

Html.Telerik().IntegerTextBox().HtmlAttributes(new { @class = "ra" })

.ra {
    position: relative;
}

.ra  .t-formatted-value {
    left: auto;
    right: 0;
}

All the best,
Dimo
the Telerik team

[Nim]

When I have a chance, I will run a quick test.
Thank you!

[Harold]

Hi, I'm having the same problem and try to do this

.css

.currencyTextBox   /*telerik.currencyTextBox style*/
{
    position:relative; 
}
.currencyTextBox .t-formatted-value {
    left:auto;
    right: 0;
}

vb.Class
<DisplayFormat(DataFormatString:="{0:C}")>

Public Property Monto As Decimal

View .vbhtml

@Html.Telerik.CurrencyTextBoxFor(Function(model) model.Monto).Spinners(False).Value(0).DecimalDigits(2).MinValue(0).HtmlAttributes(New With {.class = "currencyTextBox"}).InputHtmlAttributes(New With {.style = "text-align:right"}).CurrencySymbol(" ")
@Html.ValidationMessageFor(Function(model) model.Monto)

I set the HtmlAttribute and the InputHtmlAttribute, cause I need to align them to right when I'm editing and displaying too.

If you type an amount with 3 decimal digits the error doesn't display but if you type 2 decimal digits the error shows up like this


Thanks in advance