easyui-datagrid单元格中的按钮

时间:2014-12-17 10:20:04

标签: datagrid linkbutton jquery-easyui

我从php文件中获取了一个easyui-datagrid。我想在柱子上插一个按钮,但我不知道怎么做... 这是我的代码

<table id="dg_lineas_albaran" class="easyui-datagrid"  style="width:700px;height:auto"
                data-options="
                    iconCls: 'icon-edit',
                    singleSelect: true,
                    toolbar: '#tb_lineas_albaran',
                    onClickRow: onClickRow
                ">
            <thead>
                <tr>
                    <th id="combo_productos" data-options="field:'cod_producto',width:60,
                    formatter:function(value,row){
                                return row.cod_producto;
                            },
                            editor:{
                                type:'combogrid',
                                options:{
                                    panelWidth: 500,
                                    idField: 'cod_producto',
                                    textField: 'cod_producto',
                                    mode: 'remote',
                                    url: 'get_productos_combo.php',
                                    columns: [[
                                        {field:'cod_producto',title:'Cod_producto',width:50,sortable:true},
                                        {field:'descripcion_producto',title:'Descripcion',width:150,sortable:true},
                                        
                                              ]],
                                    fitColumns: true,
                                				
                                }
                                
                            }
                            
                    ">CODIGO</th>
                   <th data-options="field:'descripcion_producto',width:250,editor:'text'">OBSERVACIONES</th>
                   <th data-options="field:'cantidad_producto',width:80,align:'right',editor:'numberbox'">Cantidad</th>
                   <th data-options="field:'precio_producto',width:80,align:'right',editor:{type:'numberbox',options:{precision:2}}">PRECIO</th>
                    <th data-options="field:'importe_producto',width:80,align:'right',editor:'numberbox'">IMPORTE</th>
                    <th data-options="field:'action',width:80,align:'right'"
                            
                    >NUM SERIE</th>
                    
                    <th data-options="field:'status',width:60,align:'center',editor:{type:'checkbox',options:{on:'P',off:''}}">Status</th>
                </tr>
            </thead>
        </table>

我想在与组合相同的列中插入一个按钮,在NUM_SERIE的单元格中插入另一个按钮以打开一个easyui窗口。

感谢所有人。

2 个答案:

答案 0 :(得分:0)

将其添加到$(function(){ ... }

中的javascript文件中
$("#dg_lineas_albaran").datagrid({

    // Fires when data in datagrid is loaded successfully
    onLoadSuccess:function(){

        // Get this datagrid's panel object
        $(this).datagrid('getPanel')

            // for all easyui-linkbutton <a>'s make them a linkbutton
            .find('a.easyui-linkbutton').linkbutton();

    }

});

问题是在浏览器加载easyui后加载网格中的数据。为了让easyui能够识别链接按钮,您必须告诉它在加载数据后查找它们。

答案 1 :(得分:-1)

这是一个示例,将其添加到数据网格

<th field="PRO_RIF" align='right' width="50" formatter="acciones">Aciones</th>

使用此示例脚本

 <script>
function acciones(val,row){
        var url = 'print.php?id='+val;
        return '<a target="_blank" href="' + url + '"><button>Print</button></a>';
}
 </script>