DatePicker Validation Message on new line

2 posts, 0 answers
  1. Tim
    Tim avatar
    3 posts
    Member since:
    Dec 2014

    Posted 09 May 2017 Link to this post



    Our DatePicker's Validation Message is overlapping with the DatePicker's input. I attached an image of the problem.


    It seems that the <span> element containing the validation message is in the wrong location for the DatePicker. On the same page we have a ComboBox, which has the validation <span> element one level higher than the DatePicker. I tried this in Chrome and moved this element:

    <span class="k-widget k-tooltip k-tooltip-validation k-invalid-msg field-validation-error" data-for="SubscribeTill" data-valmsg-for="SubscribeTill" id="SubscribeTill_validationMessage" role="alert">


    up one level, from inside this element:

    <span class="k-picker-wrap k-state-default">


    to inside this element:

    <span class="k-widget k-datepicker k-header">


    And after this, it seems to work exactly like the ComboBox.


    It seems this is a bug, but we kind of need this working right now. Is there a way we can move this span manually?





  2. Stefan
    Stefan avatar
    1786 posts

    Posted 11 May 2017 Link to this post

    Hello Tim,

    In general, this can occur for some of the widgets because they have a specific rendering.

    I can suggest checking the following article demonstrating how the validation tooltip position can be modified:

    If the issue still occurs, please send a runnable example which is reproducing it and we will investigate further.

    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top