mercredi 25 septembre 2019

How to check/uncheck checkbox slowly kendo grid

In my application, I'm using the kendo grid to display data. I'm using dropdown which contains three values called 'opt-in, opt-out and all'. when user select Opt-in from the drop-down and particular data is listing.

enter image description here

In the above grid, you can see, there is a checkbox column called opt in. once the user unchecks the checkbox that row is quickly removing from the grid. (because of its become to the opted-in status ).

code (this works fine)

$("#productServicesByLocationGrid .k-grid-content").on("change", "input.chkbx", function (e) {

    e.preventDefault();
    var grid = $("#productServicesByLocationGrid").getKendoGrid();
    var dataItem = grid.dataItem($(e.currentTarget).closest("tr"));
    dataItem.set("OptIn", this.checked);
});

I need to avoid this quick remove and need to add some slowness to uncheck the checkbox. therefor, I change my code as follows,

$("#productServicesByLocationGrid .k-grid-content").on("change", "input.chkbx", function (e) {

    var delayInMilliseconds = 1000; //1 second
    setTimeout(function () {
    e.preventDefault();
        var grid = $("#productServicesByLocationGrid").getKendoGrid();
        var dataItem = grid.dataItem($(e.currentTarget).closest("tr"));
        dataItem.set("OptIn", this.checked);
    }, delayInMilliseconds);
});

But after changing the code as above, it's not working fine, the checkbox is unchecking slowly, it's working, but it's opt-in status not changed to the opt-out status. how can I add some slowness to the checkbox to display slowly uncheck and check state change? have any proper way to show slowly checkbox uncheck and check.




Aucun commentaire:

Enregistrer un commentaire