JSFiddle - React, Tailwind, and code Playground

by Casufi

HTML

<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.bootstrap.min.css">
<script src="https://kendo.cdn.telerik.com/2015.3.1111/js/kendo.all.min.js"></script>
use dblclick to edit row<br>
use enter to Save row<br>
<div id="grid_R24610527925451090793"></div>

JavaScript 1.7

var grid_doci_out = 0;
var grid_doci_out_elem = 0;
var grid_data = {"row":[{
  "doci_id" : 2784176,
  "doci_doc" : 192047,
  "seq_id" : null,
  "oper" : "",
  "itm_itmg" : 41,
  "itmg_name" : "Group1",
  "doci_itm" : 85,
  "itm_name" : "Item 1 d2",
  "doci_ius" : 533,
  "ius_name" : "pcs.",
  "doci_itpt" : "431",
  "itpt_name" : "",
  "doci_count" : 0.14
},{
  "doci_id" : 2784182,
  "doci_doc" : 192047,
  "seq_id" : null,
  "oper" : "",
  "itm_itmg" : 41,
  "itmg_name" : "Group1",
  "doci_itm" : 85,
  "itm_name" : "Item 1 d2",
  "doci_ius" : 533,
  "ius_name" : "pcs.",
  "doci_itpt" : "432",
  "itpt_name" : "",
  "doci_count" : 0.635
},{
  "doci_id" : 2784181,
  "doci_doc" : 192047,
  "seq_id" : null,
  "oper" : "",
  "itm_itmg" : 41,
  "itmg_name" : "Group1",
  "doci_itm" : 85,
  "itm_name" : "Item 2 d2",
  "doci_ius" : 533,
  "ius_name" : "pcs.",
  "doci_itpt" : "442",
  "itpt_name" : "",
  "doci_count" : 0.45
},{
  "doci_id" : 2723939,
  "doci_doc" : 186096,
  "seq_id" : null,
  "oper" : "other",
  "itm_itmg" : 41,
  "itmg_name" : "Group1",
  "doci_itm" : 85,
  "itm_name" : "Item 2 d2",
  "doci_ius" : 533,
  "ius_name" : "pcs.",
  "doci_itpt" : "442",
  "itpt_name" : "",
  "doci_count" : 0.784
}],"total":9, "rowsdata":[]}

$(document).ready(function () {
    function Create_Grid_R24610527925451090793() {
        var extDataBound = function (o) {
            var grid = o.sender;
            var next_row;
            o.sender.element.on('clonerow', 'tbody>tr', function (e, o) {
                console.log($(this));
            });

            o.sender.element.on('dblclick', 'tbody>tr', function (e, o) {
                if (!$(this).is(".k-grid-edit-row")) {
                    grid.editRow($(this));
                    var next_row = $(this).next("[role='row']");
                }
            });

            o.sender.element.on('keypress', '', function (e, o) {
                if (!e.altKey && !e.ctrlKey && !e.shiftKey && e.keyCode == 13) {
                   ...