easyui datagrid 每条数据后添加操作按钮

easyui datagrid 每条数据后添加“编辑、查看、删除”按钮

1、给datagrid添加操作字段:字段值

<table class="easyui-datagrid" data-options="singleSelect:true,collapsible:true,url:'publish.json',method:'get',fit:true" 

                style="width: 700px; height: 250px">

                <thead>

                    <tr>

                        <th data-options="field:'itemid',width:'10%',align:'center'">序号</th>

                        <th data-options="field:'productid',width:'15%',align:'center'">标题</th>

                        <th data-options="field:'listprice',width:'15%',align:'center'">信息类型</th>

                        <th data-options="field:'unitcost',width:'15%',align:'center'">附件情况</th>

                        <th data-options="field:'attr1',width:'15%',align:'center'">发布时间</th>

                        <th data-options="field:'status',width:'15%',align:'center'">发布状态</th>

                        <th data-options="field:'operate',width:'15%',align:'center',formatter:operate_formatter">操作</th>

                    </tr>

                </thead>

            </table>
View Code

2、javascript实现:

     <script type="text/javascript">

         function operate_formatter(value, row, index) {

             return "<a href='#' class='easyui-linkbutton'>编辑</a>/\

             <a href='#' class='easyui-linkbutton'>查看</a>/\

             <a href='#' class='easyui-linkbutton'>删除</a>";

         }

    </script>
View Code

 

你可能感兴趣的:(datagrid)