jQuery Grid

Set the altrows property of the jqxGrid. Author: http://jqwidgets.com

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div id="jqxgrid"></div>

JavaScript

var dataAdapter = new $.jqx.dataAdapter({
        localdata: [
            { id: '1', field : 'a' },
            { id: '2', field : 'b' },
            { id: '3', field : 'c' },
            { id: '4', field : 'd' },
            { id: '5', field : 'e' },
            { id: '6', field : 'a' }
        ],
        datafields: [
            { name : 'id', type : 'string' },
            { name : 'field', type : 'string' }
        ],
        id: 'id',
        datatype: "array"
    }, {
        loadComplete: function (data) {},
        loadError: function (xhr, status, error) {}
    });
    $("#jqxgrid").jqxGrid({
        width: 500,
        editable: true,
        source: dataAdapter,
        enabletooltips: true,
        columns: [
            {
                text: 'Id',
                datafield: 'id',
                width: 100,
                editable : false
            },
            {
                text: 'Field',
                datafield: 'field',
                width: 100,
                editable : false,
                columntype: 'custom',
                createwidget: function(row, column, value, htmlElement) {
                    var widget = $('<button></button>');
                    $(htmlElement).append(widget);
                    var $button = widget.jqxButton({template: 'link'});
                    $button.text( value )
                }
            }
        ]
    });