Hi Guys

This stupid little issue is taking up way way too much time for me to resolve..

I am setting a timepicker as follows:

  <td class="tg-7uzy">

                @Code
                    With Html.Kendo().TimePicker()
                        .Name("1Open")
                        .Events(Function(events) events.Change("settime"))
                        .Value(New TimeSpan(0, Model.Hours(1).open, 0))
                        .Min(New TimeSpan(0, 0, 0))
                        .Max(New TimeSpan(0, 0, 0))
                        .Render()
                    End With
                End Code
            </td>

The result is as per the attached screen shot.

It 'looks like' the values are set right as the timepickers have the correct times , but when you drop down, it always starts at midnight and the current time is not highlighted.  I assume the timepicker needs the value to be set with AM or PM .. but that can't be done from a TimeSpan or a datetime.. the am pm always has dots ( a.m.  , p.m.)

If tried adding .Format("HH:mm:tt") and  .ParseFormats(New String() {"HH:mm:tt"}) etc, but I just can't get it to work. ( I've tried allot more formats than just these, I've tried "HH:mm tt" ,"HH:mm t.t." ( cause it's the dots around the am pm which seems to be whats stopping.))

Feeling a bit stupid having to ask this as it seems to be a straightforward thing.

I'm sure I will have a Face palm moment when shown the error in my ways.. but I've got to the point of not caring! :)

Cheers

Rob

Hi,

I have a Kendo Grid and its first column is a Datetime and Its a Kendo DatePicker.

When the user click on Add new record button then the 1st cell which is a date picker should be auto focus.

Note: When the user click on Add new record button then we are sorting the grid in ascending order so that the new row should appear on the top, which is working fine but the 1st cell of the newly created row a Kendo Date picker in not in focus.

But when the user click on the first cell of the newly created row, then it opens the datepicker to allow user to select a date.

My requirement is when i am clicking the Add new record button then 
1. It should sort in ascending order (Which is working now)

2. The 1st cell of the Kendo Datepicker should auto focus like the above screenshot.

I am using a Kendo.Filter object like the following to filter results in a Kendo Grid:

@(Html.Kendo().Filter<CustomPersonClass>()
     .Name("personFilter")
     .DataSource("peopleDS")
     .ApplyButton(false)
     .Fields(f =>
     {
         f.Add(p => p.LastName).Label("Last Name");
         f.Add(p => p.FirstName).Label("First Name");
         f.Add(p => p.MiddleName).Label("Middle Name");
         f.Add(p => p.StartDate).Label("Start Date").Operators(o => o.Date(d => d.Eq("Is equal to").Gte("Greater than equal").Lte("Less than equal")));
     })
)

 I have helper code to handle the toolbar in my Kendo Grid like the following, :

@helper ToolbarTemplate()
{
    <button class="k-button k-button-solid k-button-solid-base" id="applyFilter"><span class="k-icon k-i-filter"></span>Apply Filter</button>
    <button class="k-button k-button-solid k-button-solid-base" id="clearFilter">Reset</button>
    <button class="k-button k-grid-excel k-button-solid k-button-solid-base"><span class="k-icon k-i-excel"></span>Export to Excel</button>
}

I also have some JavaScript in a function to apply the filter when the Apply Filter button is clicked, as seen here:

$("#applyFilter").click(function (e) {
    //e.preventDefault();
    var myFilter = $("#personFilter").getKendoFilter();
    localStorage["kendo-person-filter-options"] = kendo.stringify(myFilter.getOptions().expression);
    myFilter.applyFilter();
});

The problem I am having is if I enter an invalid Leap Year date (e.g. 2/29/2003, since 2023 didn't have a February 29th), I get no data back; however, if I enter a valid Leap Year (e.g. 2/29/2004), my Kendo Grid will show data.  Is there a way to validate the date that is being entered manually into a DatePicker field used for filtering?  That is, if I use the DatePicker, it will not show me 2/29/2003 as an option, but if I type in 2/29/2003 and click Apply Filter, it doesn't throw any kind of error about 2/29/2003 being invalid.

I have a datepicker in a view 

@(Html.DatePickerFor(model => model.EventDate)
     .Format("{0:dd/MM/yy}")
)

I need to retrieve the date from the datepicker to use as the minimum value for a datetimepicker in a list view. 

		shiftStart.kendoDateTimePicker({
			timeFormat: "HH:mm",
			format: "dd/MM/yyyy HH:mm",
			// min: new Date(vYear, vMonth - 1, vDay, vHour, vMinute),
			interval: { minutes: 15 }
		});

How do I get that value?

We want to use the DatePicker like this:

<div class="row">
    <div class="col">
        <div class="form-group">
            @Html.LabelFor(model => model.TESTDATUM, htmlAttributes: new { @class = "control-label" })
            <div>
                @Html.Kendo().DatePickerFor(model => model.TESTDATUM)
                @Html.ValidationMessageFor(model => model.TESTDATUM, "", new { @class = "text-danger" })
            </div>
        </div>
    </div>
</div>

But this renders the control like this:

We're currently using the following workaround to trim the overlapping part, which feels kind of 'hacky':

<div style="width: 17.5em">
    @Html.Kendo().DatePickerFor(model => model.TESTDATUM)
</div>

A bug has been introduced recently where the calendar icon for DatePicker does not display

I can duplicate this bug using your REPL

https://demos.telerik.com/aspnet-core/datepicker

From here I add after line 9

I am trying to add a new form to an existing ASP.NET MVC 5  application (.NET Framework). I have been unable to get the TimePicker control to return the value set in the UI. The control renders correctly and shows the values I would expect. But when I submit the form, the model's property value linked to the TimePicker is always all zeros or null. What am I doing wrong here?

Example code:

Model.cs

public class TestModel
{
  public TimeSpan Start { get; set; }
}

TestController.cs

public class TestController : Controller
{
  public ActionResult Index()
  {
    TestModel testModel = new TestModel();
    testModel.Start = new TimeSpan(7, 30, 0);
    return View("Schedule", testModel);
  }

  [HttpPost]
  public ActionResult Schedule (TestModel schedule)
  {
    // I intend to save 'schedule' value to database here.
    // but schedule.Start property is always [0, 0, 0]
    // If TestModel.Start is defined as TimeSpan?, then the property is always null
    ...
    return RedirectToAction(...);
  }
}

Schedule.cshtml

@model TestModel
@{
  Layout = "~/Views/Shared/_Layout.cshtml"
}

@using (Html.BeginForm("Schedule", "TestController", FormMethod.Post))
{
    <div class="form-horizontal container-fluid" style="margin-left:15px;">

I have tried a variety of different MVC ways to instantiate the TimePicker:  TimePickerFor (as above) or just TimePicker, defining .Name() property or not, defining .Value(model.Start) or not, adding .Min & Max properties. The result in the Schedule controller is the same: no value assigned to any TimePicker control.

The other thing I tried was change the TestModel.Start property to DateTime. Doing that, the form submit is always short-circuited, apparently because of a model validation issue in the TImePicker control. Form focus always changes to the TimePicker control. I have not been able to view the actual validation error.

Hoping someone can identify the problem with my code. The TimePicker control seems ideal for the application I have in mind but if I can't get it working I'll have to do something else.

I am testing this code in VS 2022. The version of Kendo our application uses is older: v2022.1.301.

FYI, our application already uses a wide variety of Kendo controls including Grid, DateTimePicker, DropDownList and several others. We have not had trouble using those controls. But as far as I can tell, this is the first instance of TimePicker being added.

Thanks,
Jeff

Kendo UI for JQuery MVC 2024.1.319 upgraded in WebApp to .NET 4.6.2. Runs fine in VS 2019, but when deployed to web server, the, the Date and Time pickers don't appear when editing a Grid cell DateTime field, instead it just has a text box with the likes of "Wed May 08 2024 01:30:00 GMT-0400 (Eastern Daylight Time)".  I've compared the Dev build (which works) to the Production deployment, and all the files match up. Which suggests that something is out of date or missing. Not seeing any errors in the Developer's Tools' Console (other than some cookies being blocked, which sounds unrelated).

Kendo.MVC.resource.dll (Kendo.MVC.Web) shows version 2024.1.319.545 with in the Bin folder under IIS, so it seems like at least that much is what is expected - could I have ended up with a mixed bag of Kendo libraries or scripts?  How would I tell?

I am new to Kendo UI, so this may be a pretty obvious thing, but I've just about exhausted the obvious and simple things I can think of to check!

Thanks in advance!!

Hi Telerik,

I got an issue when rendering kendo datepicker. At first time we open the page, the value of Kendo datepicker populated. But then, after refresh (via browser button or f5) the value was gone, and only the format shown like below:

The only way to make it populated is to:

• Hard reload the page (ctrl+f5)
• change the browser (tested on chrome).
• change datepickerfor to datepicker() and add .value(x.FldBirthdate.Value.ToString("MM/dd/yyyy")).
  we have to ToString() it, if it's only x.FldBirthdate, it doesn't work.

Here is how I render the kendo datepicker

@(Html.Kendo()
                    .DatePickerFor(x => x.FldBirthdate)
                    .Max(DateTime.Now)
                    .DateInput()
                    .Format("dd/MM/yyyy")
                    .ParseFormats(new List<string>() { "dd MMM yyyy" })
                    .HtmlAttributes(customAttributes)
                    .Events(x => x.Change("dateOnChange"))
                )

I already tried to remove the max, dateinput(), format, parseformat, htmlattributes but the problem still persist.
There is no error message shown in the console.

Kendo version: 2019.3.1023
Jquery version: 3.4.1

Please advise.
Thank you.

Hi,

We are using the current culture fr-BE which uses dd-MM-yyyy format but when using the DatePicker and inspecting the HTML, we see the following.

As you can see in the screenshot below, the culture is correctly set. 

This happens only with fr-BE, we can see no problems when switching between nl-NL, en-GB, nl-BE, etc.

When we add .Format("d") the component works correctly but that's not what I would expect, since "d" is the default.

And to be honest, I don't want to add that manually everywhere. It should take the correct one as a default.

Our current version is 2022.3.913 but updating is not possible at the moment.

Any help would be appreciated

Kind regards