let me explain what issue i am facing , i have two cloumns in kendogrid one is dropdown and other is simple textbox
let say dropodown column has (emailadress, website dropdown) now i want to match the exact expression of mail to the other column
if it matches then save the record if not matches than show the toolptip and prevent for saving changes
this is the code
save: function(e) {
// Get the data item being saved
var dataItem = e.model;
// Access properties of the data item and perform actions accordingly
var addressType = dataItem.intInternetAddressTypeID;
var inputField = dataItem.strInternetAddress;
// Perform validation or other actions based on the properties
if (addressType === "2") {
// Email validation for input field
var emailRegex = /^[^\s@@]+@@[^\s@@]+\.[^\s@@]+$/;
if (!emailRegex.test(inputField)) {
// Set validation message on the corresponding cell
e.container.find("[name=strInternetAddress]").closest("td").attr("data-strInternetAddress-msg", "Invalid email address format");
e.preventDefault(); // Prevent saving the record
}
} else if (addressType === "10") {
// Phone number validation for input field
var phoneRegex = /^[0-9]+$/;
if (!phoneRegex.test(inputField)) {
// Set validation message on the corresponding cell
e.container.find("[name=strInternetAddress]").closest("td").attr("data-strInternetAddress-msg", "Invalid phone number format");
e.preventDefault(); // Prevent saving the record
}
}
},
i also enable the tooltip from databound
dataBound: function (e) {
e.sender.element.find("[data-strInternetAddress-msg]").each(function () {
$(this).kendoTooltip({
position: "bottom",
content: $(this).attr("data-strInternetAddress-msg"),
});
});
}but tooltip is not showing in the page , it preventing from saving but not showing tooltip after inspection i found that it creating this html
<td role="gridcell" data-container-for="strInternetAddress" data-strinternetaddress-msg="Invalid email address format"><input type="text" class="k-input k-textbox k-valid" name="strInternetAddress" required="required" data-required-msg="Internet Address is required" data-bind="value:strInternetAddress"></td>
Help me how to show the tooltip not alert i dont want alert
Hi,
as the title says i'm trying to open an alert on the Select Event of a kendoContextMenu, but the alert is shown only after the Select function is completed, is it possible to show an alert as soon as the user clicks on the ContextMenu option (at the start of the Select Event)?
Below the Select Event of my code:
select: function (e) {
alert("Test Alert"); //This one appears only after that the Select function ends, but i'd want it to appear as soon as the select function starts
//MY CODE
}
Thanks in advance,
- Antonio
I'm trying to hide/disable the tooltip when you hover over a page number in pagination toolbar in the kendo grid:
I've spend several hours reading the documentation and forums, awnsers are either outdated or do not seem to work.
How do I hide this tooltip/popup?
Regards,
Jorre Vedder
Hello,
I want the tooltip to remain open when trying to click on the content of tooltip. Below is my code.
---Grid
@(Html.Kendo().Grid<AgeInformation>()
.Name("AgeInformationGrid")
.Columns(columns =>
{
columns.Bound(p => p.FundAge).Title("Agency").ClientTemplate("#=FundAge.FedAgeDesc#").Sortable(false).Width(175).HeaderHtmlAttributes(new { @class = "FundAgeClass" });
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:500px;" })
.DataSource(dataSource => dataSource
.Ajax()
.AutoSync(false)
.Batch(false)
.PageSize(20)
.ServerOperation(false)
.Events(events => events.Error("errorHandler"))
.Events(events => events.RequestEnd("onAgeInformationRequestEnd"))
.Model(model => {
model.Id(p => p.AgeInformationId);
model.Field(p => p.AgeInformationId).Editable(false);
model.Field(p => p.FundAge).DefaultValue(new FedAgency());
})
.Create(update => update.Action("AddAgeInformation", "Coversheet").Type(HttpVerbs.Post))
.Read(read => read.Action("GetAgeInformation", "Coversheet").Type(HttpVerbs.Get))
.Update(update => update.Action("EditAgeInformation", "Coversheet").Type(HttpVerbs.Post))
.Destroy(update => update.Action("DeleteAgeInformation", "Coversheet").Type(HttpVerbs.Post))
)
//.Events(events => events.Edit("onAgeInformationEdit"))
)
function ToolTipsForAgency() {
$(".FundAgeClass").append(" <i class='far fa-question-circle'></i>");
$(".FundAgeClass").attr("data-html", "true");}
Any help is appreciated