Hi Team,
I am using the Kendo DateTimePicker and validator to validate the dates. Please find the below code. The issue I am having is that I see the "error message" for all the fields even thought rules returns true for those field. For example, I see the error message for the fields that have return value "false" which is fine. However, after running the validator, once I click on each field, I see the error message for that field. Even though these field have return value "true" from the function I have attached. I do not understand why I see the error message for all the fields.
1) What I want is I have two conditions in the function (if, else if). If these conditions get true, I want to display the error message. Otherwise, no error message needs to display because those dates are valid.
2) Is there a way to clear/reset the error message if there is any for a specific date field.
I really appreciate your help team. Please get back to me as soon as you can, I am waiting for your relpy.
function executeMaxMinValidationOnEachDate(datesArray) {
//$("#validateEditableFields").kendoValidator({
var minDate = 0;
var maxDate = 2;
var validator = $("#validateEditableFields").kendoValidator({
rules: {
datepicker: function (input) {
var currDate = kendo.parseDate(input.val()).getTime();
if (maxDate === 10) {
if (input.is("[data-role=datetimepicker]") && currDate < datesArray[minDate]) {
return false;
}
}
else if (input.is("[data-role=datetimepicker]") &&
(currDate < datesArray[minDate] || currDate > datesArray[maxDate])) {
minDate++;
currentDate++;
maxDate++;
return false;
//return input.data("kendoDateTimePicker").value();
} else {
minDate++;
currentDate++;
maxDate++;
return true;
}
}
},
messages: {
datepicker: "Please enter valid date!$$$$"
}
}).data("kendoValidator");
validator.validate();
}
The Boostrap grid system gives wrong result in a Window.
The grid seems to have only 9 columns.
My View :
@(Html.Kendo().Window() .Name("window") .Title("My window") .Width(400) .Content(@<text> <div class="row"> <div class="col-md-3"> First col </div> <div class="col-md-3"> Second col </div> <div class="col-md-3"> Third col </div> <div class="col-md-3"> Fourth col </div> </div> </text>))The result is shown in the png file.
Any suggestions will be very appreciated.

@(Html.Kendo().TreeView()
.Name("treeviewDetails")
.Items(treeview =>
{
treeview.Add().Text("Information")
.Expanded(true)
.Items(root =>
{
root.Add().Text("Priority" + ": " + InOnwHours);
root.Add().Text("Due Date" + ": " + "Today");
root.Add().Text("Return emails" + ": " + "example@gmail.com");
});
}
How i can format the part of text in root.Add().Text text ? i need show the text after ":" in different color, style and size. (for example example@gmail.com in red) see attached image.
Thank you for help.

Is there a way to have only icons in the commands of the tree list like there is for Grid?
I manage to do this for Edit, Delete and CreateChild. But I can not do this for Update and Cancel buttons

Hi Team,
I am using the Telerik DateTimePicker ASP.NET MVC, and I noticed that after clicking onto the calendar, once I navigate to "Time" tab of the calendar, "Hour" and "Minutes" are not aligned properly. The higher "Minute" I select does not align in the center. For example, if I select "minute" 10, then it would stay in the center of the minute column. However, if I select 58 minute, then it would not be in center of the minute column.
Please find the attached screenshot to review the issue I am having, and please get back to me as soon as you can.
I am looking forward to hearing back from you.
Best,
Mayur Maisuria
Hi Team,
I am using the DateTimePicker and below is the code.
@(Html.Kendo()
.DateTimePicker()
.ComponentType("modern")
.Name("dpLTSummaryCompletionDate")
.HtmlAttributes(new { style = "width: 185px;"} )
.Events(e => e.Change("dpLTSummaryCompletionDate_change"))
.Value(Model.CompletionDtTm)
.Format("MM/dd/yyyy h:mm:ss tt")
.ParseFormats(new string[] { "MM/dd/yyyy h:mm:ss tt" })
.DateInput(true)
.Max(Model.TakenDtTm.AddYears(1))
.Min(Model.OnsiteDtTm))
//In the Jquery file
$(document).on('keydown keyup', '#dpLTSummaryCompletionDate ', function () {
let dateTimePicker = $("#dpLTSummaryCompletionDate").data("kendoDateTimePicker");
let dateInput = dateTimePicker._dateInput;
let input = dateInput.value().getTime();
let min = dateTimePicker.min().getTime();
let max = dateTimePicker.max().getTime();
if (input < min || input > max) {
dateInput.value(null);
}
});
I have the "keydown keyup" event in the .js file. It seems like the ".getTime()" value for the first time I enter the date by keyboard into the date field is not the same as I get it from the second time and onwards.
For example, I have set up the Min and Max date, and I want to allow a user to enter any date between and including Min and Max dates. However, right now for the first time I enter the date, it allows only Min but not Max since ".getTime()" values for the Max date and user input (assuming user enters the max date) are not the same. As a result, the below condition gets true and date field gets null/empty.
NOTE - It allows me to enter the max date from the second time and onwards, but not the first time because ".getTime()" values are the different for the "Max()" date and the date I enter even though I enter the same Max date.
if (input < min || input > max) {
dateInput.value(null);
}
Please help me out on this since I am having issue and could not resolve.
Best,
Mickey
Below is my MultiSelect for a List<long> property of my model. In DataSource Read I am giving a js Function name "userIdFilter"
@(Html.Kendo().MultiSelectFor(m => m.PositionIds) .Filter("Contains") .Name("PositionIds") .Placeholder("Select Position") .ValuePrimitive(true) .DataTextField("Name") .DataValueField("Id") .DataSource(d => d.Read(read => { read.Action("GetAllPositions","PositionCodeAjax").Data("userIdFilter"); }).ServerFiltering(true)) .HtmlAttributes(new { style = "width:95%;" })this is userIdfilter method in a script tag
<script> function userIdFilter() { console.log($("#Id").val());
setTimeout(() => console.log($("#Id").val()), 100);
return { userId: $("#Id").val() }; }</script>This is the numeric text box that has id="Id". I have applied display:none to its parent element
@(Html.Kendo().NumericTextBoxFor(m => m.Id).Enable(false))All these snippets lie in a PopupEditView.cshtml which is called when editing/creating and element from the grid in my index.cshtml file
Now When I call Test it with edit command Edit pop up appears and userIdFilter is called. and value "0" is printed. after 100ms value "1182" is printed. Also my actionMethod recieves value 0.
But when I call userIdFilter() from console it logs value 1182 (the correct value) also object { userId: 1182 } is also logged and after 100ms value 1182 is printed.
Also if I happen to inspect the multiselect in the popup before the request with wrong value for dataSource is sent, Kendo makes a second request with correct value and it works as it should
I just cannot understand this strange behaviour and what is going wrong. Need help

Hi Team,
I am using the below attached code for the date field.
@(Html.Kendo()
.DateTimePicker()
.ComponentType("modern")
.Name("dpLTSummaryCompletionDate")
.HtmlAttributes(new { style = "width: 185px;"} )
.Events(e => e.Change("dpLTSummaryCompletionDate_change"))
.Value(Model.CompletionDtTm)
.Format("MM/dd/yyyy h:mm:ss tt")
.ParseFormats(new string[] { "MM/dd/yyyy h:mm:ss tt" })
.DateInput(true)
.Max(Model.TakenDtTm.AddDays(365))
.Min(Model.OnsiteDtTm))
Since I am using the "DateInput()", I can change the date (Month, Day, Year, etc) from the keyboard (by pressing the arrow key). What I want to do is if I am changing the date and if the date gets prior to MIN date or later to Max date, then I want to display the "placeholder" instead of "date being automatically reset" to either MIN or MAX. For example, let's assume the MIN date is set to "12/12/2012 12:12:12 PM" and as soon as I have the date "12/12/2012 12:12:11 PM" in the date field which is less to MIN date by 1 second (assuming I am changing the date by arrow key), I want to display the placeholder.
I am not sure how to trigger an event for the keyboard input to the date field (by changing a date by an arrow key)
Please reach out to me as soon as you can since I am working on essential project.
I have a grid with Edit mode Popup code like below, this popup is good to add a new record.
Is there a way I can have 'View Only' Command instead of 'Edit' to show all data fields of a row in the popup?
I need it is because I need pull out more fields which are not in grid row.
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ItemEdit").Window(w => w.Title("Edit Item").Width(800)))
Thanks.
