Hi, following on from http://www.telerik.com/forums/why-is-the-span-position-static#NeKbtFbNzUGLtgZqX1kKmg
I notice that if the name attribute is removed, for example, http://dojo.telerik.com/IyoVU/5 then the tooltip is again disappearing. Does the validation require that elements have the name attribute?
I have a problem with the tooltip validation appearing in front of some elements and behind others (e.g. input kendo-numeric-text-box). When I look at the CSS for the span that holds the tooltip it has a z-index of 9999 which looks good, but then it has position:static . From what I've read around the internet e.g. https://css-tricks.com/almanac/properties/p/position/
z-index only works when the position is not static. Indeed if I add
span .k-tooltip-validation {
position
:
relative
;
}
then it appears in front of the numeric text box. Why is relative not the default setting for the tooltip?
Thanks
When you update an MVVM model using the proper "set" method, any validators tied to controls tied to the model do not fire. I'm assuming it is because the validator is wired to the "blur" event of the textbox. I would prefer to not wire the validator to the "change" event, if possible.
For example, I have a textbox that is required. If I blank out the value, the validator fires correctly. If there is some other action that changes the model, the validator does not re-execute and therefore remains.
I've made a simple Dojo that represents this.Blank out the textbox, tab or click out, and then click the "Alter Model" button.
http://dojo.telerik.com/oVEgE
Hi,
I noticed, that when using a validation for kendo grid fields, only some fields get the k-invalid class. This can be easily seen on the demo page: http://demos.telerik.com/kendo-ui/grid/editing-custom-validation .
All the empty fields are correctly validated, but only ProductName fields has the k-invalid class. The Unit Price and Units In Stock don't (they still kave the k-valid class, although there is tooltip saying that field is required). So my problem is that I want to style invalid fields with red background etc, and it simply doesn't work for numeric fields.
Is that a known issue? Any workarounds for now?
Thanks,
Pawel
Hi,
I need to validate that one or more checkboxes have been checked in a group. I read some other relative threads about that in this forum but I can't find my way with the responses. I was thinking it was something close to the way we do with radio-buttons, so I just replaced type=radio with type=checkbox in the following dojo example: http://dojo.telerik.com/uHEto
It seems that kendo.validate() does not pass on input type=checkbox (except when already checked !) and it appears to be an issue to me.
Note that I want to make this checkboxes' validation with kendo validator, not on an event like onsubmit for instance.
thank you for your help
Hello,
I have a textbox with a simple required field validator using kendo. I would like to style it using a new CSS class created by us like this:
<
span
class
=
"label"
>Name:</
span
>
<
input
type
=
"text"
name
=
"Name"
class
=
"k-textbox"
required
data-required-msg
=
"Please enter a name."
/>
<
span
class
=
"k-invalid-msg k-x-invalid-msg-block"
data-for
=
"Name"
></
span
>
The problem is that whenever the validation happens our CSS class named k-x-invalid-msg-block is removed from the tooltip span or replaced by another HTML construct that looks like this:
<
span
class
=
"k-widget k-tooltip k-tooltip-validation k-invalid-msg"
data-for
=
"Name"
role
=
"alert"
>
<
span
class
=
"k-icon k-warning"
> </
span
>
Please enter a name.
</
span
>
As you can see our k-x-invalid-msg-block is gone. Is this on purpose? What is the preferred way of styling the tooltip then?
All I would like to do is add a "display:block;" since I need to display the tooltip below the input.
Kind regards,
Krisztián
In a Kendo Grid, I have a column that contains a date. I'm using this method for inserting my own control into the cell to edit the date:
function
dateTimeEditor(container, options)
{
console.log(
"options"
, options);
$(
'<input data-text-field="'
+ options.field +
'" '
+
'data-value-field="'
+ options.field +
'" '
+
'data-bind="value:'
+ options.field +
'" '
+
'data-format="'
+ options.format +
'" '
+
'/>'
)
.appendTo(container)
.kendoDateTimePicker(
{
format:
"MM/dd/yyyy"
,
parseFormats: [
"yyyy/MM/dd"
,
"MM/dd/yyyy"
, ],
});
}
In the column definition I have this:
{
field:
"probeDate"
,
title:
"Probe Date"
,
width: 60,
format:
"{0:MM/dd/yyyy}"
,
editor: dateTimeEditor,
attributes: { class:
"editable-cell"
},
}
So far this works great. Now I wanted to add custom validation to this control, so in the model I have a field defined like this:
type:
"date"
,
editable:
true
,
validation:
{
validateProbeDate:
function
(input)
{
if
(console != undefined) { console.log(input); }
// Validate the probeDate as well as all of the dynamic fields.
if
(input.val().trim() ===
""
|| parseDate(input.val()) ==
null
)
{
input.attr(
"data-validateProbeDate-msg"
,
"Probe Date must be a valid date value (mm/dd/yyyy or yyyy/mm/dd)."
);
return
false
;
}
// TODO: Make sure the date falls within the bounds of the probe.
// return new Date(input.val()) < probeStartDate...
return
true
;
}
}
This works as far as the validation as it doesn't allow me to leave the field unless my validation method returns true, but the error message won't show on the field and I've tried several methods to try to get it to show up. I assume the problem is in dateTimeEditor() where I'm defining the date edit control.
You can see this in action in this fiddle: Probe Data Entry
Thanks in advance!I have currently added the following custom validation to my interest name, but interest name has to be unique, so when user add new and existing interest name is already there, it will throw error. However, when user try to edit the record, it should be able to detect whether current interest name is changed, if it is a new interset name then only check only uniqueness validation, otherwise, it should allow the update to go through successfully.
With the following validation, when i try to perform update, it also throw the validation error, and i am do not know how to make this validation valid for Add New all the time, and valid for Update only when interest name is changed.
(function ($, kendo) {
$.extend(true, kendo.ui.validator, {
rules: { // custom rules
InterestNamevalidation: function (input, params) {
if (input.is("[name='InterestName']") && input.val() != "") {
var dataSource = $("#Customer").data("kendoGrid").dataSource;
var data = dataSource.data();
for (var i = 1; i < data.length; i++) {
if ($.trim(input.val().toLowerCase()) == $.trim(data[i].InterestName.toLowerCase())) {
input.attr("data-InterestNamevalidation-msg", "InterestName should be unique");
return false;
}
}
}
return true;
}
}
});
})(jQuery, kendo);
<
input
type
=
"checkbox"
value
=
"option1"
data-question
=
"1"
data-min
=
"1"
data-max
=
"3"
>
<
input
type
=
"checkbox"
value
=
"option2"
data-question
=
"1"
data-min
=
"1"
data-max
=
"3"
>
<
input
type
=
"checkbox"
value
=
"option3"
data-question
=
"1"
data-min
=
"1"
data-max
=
"3"
>
<
input
type
=
"checkbox"
value
=
"option4"
data-question
=
"1"
data-min
=
"1"
data-max
=
"3"
>
<
input
type
=
"checkbox"
value
=
"option5"
data-question
=
"1"
data-min
=
"1"
data-max
=
"3"
>