Question

I have a working grid (fields are name and id):

<grid stuff>
    <kendo:grid-column width="80px">
        <kendo:grid-column-command>
            <kendo:grid-column-commandItem name="delete" text="Delete">
                <kendo:grid-column-commandItem-click>
                //Here I want to grab this worker id and redirect the user to the url workerDelete.html?Id
                </kendo:grid-column-commandItem-click>
            </kendo:grid-column-commandItem>
        </kendo:grid-column-command>
    </kendo:grid-column>
    <kendo:grid-column width="80px">
        <kendo:grid-column-command>
            <kendo:grid-column-commandItem name="update" text="Update">
                <kendo:grid-column-commandItem-click>
                    // here I want to grab this worker id and redirect the user to the url workerUpdate.html?Id
                </kendo:grid-column-commandItem-click>
            </kendo:grid-column-commandItem>
        </kendo:grid-column-command>
    </kendo:grid-column>
</grid stuff>  

I need to know how to capture the data from the row when the user presses the custom button and change the view, passing the data along on the querystring.
Iam using jsp and spring.

I tried to use the following code but it didn’t work:

<script>
    function deleteWorker() {
        var grid = $('#grid').data('kendoGrid');
        var row = grid.dataItem(grid.select());
        var id = row.id;
        window.location.href = "/workerDelete.html?"+cpf; 
    }
</script>

Answer 1

You need to define the grid-column-command as follow:

<kendo:grid-column-command>
    <kendo:grid-column-commandItem name="update" text="Update" click="deleteWorker"/>
</kendo:grid-column-command>

and the deleteWorker function as:

    function deleteWorker(e) {
        var tr = $(e.currentTarget).closest("tr");
        var item = $("#grid").data("kendoGrid").dataItem(tr);
        // Do whatever else you need
    }

In this function item is Kendo Grid dataItem.