Telerik ASP.NET Core Grid - Double tap event on row

Question

I am developing a .NET Core MVC web application that will mostly be used on iPads but also some desktops. A main feature of the app is the Telerik Kendo UI grid.

Each row in the grid should be double-clickable to redirect to a details page as single clicks on certain items in the grid trigger tool-tips on touchscreens.

I have implemented the desktop version of this recently:

$("#grid").on("dblclick", "tr[role='row']", function (e) {

        var grid = $("#grid").data("kendoGrid");
        var model = grid.dataItem(this);
        var id = model.Id;

        window.location.href = '@Url.Action("Index", "Details")' + "/" + id;
    });

However I have just found out that obviously double click events don't fire on a touch screen.

Is there a way of implementing the same functionality as above but for a double click event on a touch screen?

Answer 1

I was able to solve this by using this bit of code from github user: attenzione.

And implement it like this:

$("#grid").on("doubletap", "tr[role='row']", goToDetailsPage);
$("#grid").on("dblclick", "tr[role='row']", goToDetailsPage);

function goToDetailsPage() {
    var grid = $("#grid").data("kendoGrid");
    var model = grid.dataItem(this);
    var id = model.Id;

    window.location.href = '@Url.Action("Location", "Details")' + "/" + id;
}