RadDateTimePicker EmptyText

[Mike]

Is it possible to set the "placeholder" text or "EmptyText" of a RadDateTimePicker and/or RadDatePicker?  The form I'm designing is utilizing the EmptyText property on the controls, except my DateTimePicker and DatePicker.

[Shinu]

Hi Mike,

Please try the following JavaScript code snippet to achieve your scenario.

JavaScript:

$('.riTextBox').val("Empty Message");

Thanks,
Shinu.

[Mike]

I tried this, however I have three other Telerik text boxes on the page as well as the date/time picker and a date picker.  Now they all have "Empty Message" instead of the values I set in the EmptyText property.  The issue I'm having is the date/time picker and the date picker do not have the EmptyText property.  How can I set the placeholder text [empty text value] on just the date/time picker and the date picker without affecting the other text boxes?

[Shinu]

Hi Mike,

Please try the following code snippet to achieve your scenario.

ASPX:

<telerik:RadTextBox ID="RadTextBox1" runat="server">
</telerik:RadTextBox>
<telerik:RadDatePicker ID="RadDatePicker1" runat="server">
</telerik:RadDatePicker>

JavaScript:

<script type="text/javascript">
    function pageLoad() {
        $('#RadDatePicker1_dateInput').val("Empty Message");
    }
</script>

Thanks,
Shinu.

[Mike]

Thanks for the response, however my text still isn't being displayed.

My code:

<telerik:RadDatePicker runat="server" ID="radPackageDate">
    <Calendar>
        <SpecialDays>
            <telerik:RadCalendarDay Repeatable="Today">
                <ItemStyle BackColor="LightGray" Font-Bold="True" BorderStyle="Solid" BorderColor="Black" BorderWidth="1px"></ItemStyle>
            </telerik:RadCalendarDay>
        </SpecialDays>
    </Calendar>
</telerik:RadDatePicker>

My JS:

function pageLoad() {
    $('#radPackageDate_dateInput').val("Package Date");
}

Am I missing something?

[Krishnaprabhuraja]

Hi,

Try below modified JavaScript code.

JS:

function pageLoad() {
        //  $('#radPackageDate_dateInput').val("Package Date");
        $find('radPackageDate').get_dateInput().set_textBoxValue('Package Date');
}

Thanks,
Krishna Raja

[Mike]

That worked, thanks!

[Courtlandt Harris]

I only post this because this entire thread sent me down a rabbit trail.  If, for some reason you wanted to accomplish this task via javascript, a far more effective method to accomplish EmptyMessage functionality would be to set the actual empty message of the text box.  If you just set the value as suggested above, it will disappear as soon as the control gains and looses focus.

function pageLoad() {
   $find("<%= radPackageDate.ClientID%>").get_dateInput().set_emptyMessage('Package Date');
}

However, this is far more cleanly handled server-side by just using:

RadPackageDate.DateInput.EmptyMessage = "Package Date"

[Jerry]

You can simply set the DateInput-EmptyMessage property. For example:

               

<telerik:RadDatePicker ID="rdpBirthdate" runat="server"
                    DateInput-EmptyMessage="Date of Birth MM/DD/YYYY" Skin="Default" />

​