EasyUI DataGrid 單列雙按鈕：formatter 返回操作鏈接實現編輯/刪除

需求

DataGrid 「操作」列顯示「修改」「刪除」兩個按鈕/鏈接。

實現代碼

$('#dg').datagrid({
    columns: [[
        {field: 'id', title: 'ID', width: 50},
        {field: 'name', title: '名稱', width: 100},
        {field: 'opt', title: '操作', width: 150, align: 'center',
            formatter: function(value, row, index) {
                return '<a href="javascript:void(0)" onclick="editRow(' + index + ')">修改</a> ' +
                       '<a href="javascript:void(0)" onclick="delRow(' + index + ')">刪除</a>';
            }
        }
    ]]
});

function editRow(index) {
    var row = $('#dg').datagrid('getRows')[index];
    // 彈出編輯對話框、填充數據...
}

function delRow(index) {
    $.messager.confirm('確認', '確定刪除？', function(r) {
        if (r) {
            var row = $('#dg').datagrid('getRows')[index];
            // AJAX 刪除...
            $('#dg').datagrid('deleteRow', index);
        }
    });
}

進階：按鈕樣式化

formatter: function(v, row, index) {
    return '<a class="easyui-linkbutton" data-options="iconCls:\'icon-edit\',plain:true" onclick="editRow('+index+')">修改</a> ' +
           '<a class="easyui-linkbutton" data-options="iconCls:\'icon-remove\',plain:true" onclick="delRow('+index+')">刪除</a>';
}

需在頁面加載後調用 `$.parser.parse('#dg')` 渲染 linkbutton。