BsgridPage自定义按钮

开发工具与关键技术:C# MVC
作者:刘东标
撰写时间:2019年1月16日

我要实现的效果图:

BsgridPage自定义按钮

<table id="tbRecord" class="table table-bordered">
                    <thead>
                        <tr>
                            <th w_check="true" w_index="UserID">选择</th>@*复选框*@
                            <th w_hidden="true" w_index="UserDatumID">UserDatumID</th>
                            <th w_num="total_line">序号</th>
                            <th w_index="UserName">姓名</th>
                            <th w_index="UserIDNum">身份证号码</th>
                            <th w_index="Phone">手机号码</th>
                            <th w_index="UserNuber">用户名(登录名) </th>
                            <th w_index="Remark1">角色类型</th>
                            <th w_index="Remark">备注</th>
                            <th w_render="CreatButton">操作</th>@*自定义列单元格渲染方法名, 插件使用eval(funName)执行此方法, 具有的四个参数是record, rowIndex, colIndex, options             注意如果列有w_render属性设置w_index则无意义. 列可以无w_index或w_render属性 *@
                        </tr>
                    </thead>
                </table>
                //////////////////////////////////////js代码
                <script>
            var tbRecord;
            $(function () {
                tbRecord = $.fn.bsgrid.init('tbRecord', {
                    url: '/Terminal/SelectUser',
                    autoLoad: true,//自动加载
                    stripeRows: true,//隔行变色
                    rowHoverColor: true,//划过行变色
                    displayBlankRows: false,//是否显示空白行, 默认值true
                    pageSize: 12,//分页大小, 如果设置值小于1则不分页且展示全部数据(即自动将pageAll设置为true), 默认值20
                    pageSizeSelect: true,// 是否显示分页大小选择下拉框, 配合参数pageSizeForGrid, 默认值false
                    pagingLittleToolbar: true,//是否显示精简的图标按钮分页工具条, 默认值false
                    event: {
                        customRowEvents: {
                            click: function (record, rowIndex, trObj, otions) {
                                Check("#tbRecord tr", rowIndex + 1);
                            }
                        }
                    }

                });
             
            });
        
                //1.3自定义事件 创建题目按钮
                function CreatButton(record) {
                    var UserDatumID = record.UserDatumID;
                    return "<button class='btn btn-primary btn-sm'type='button' onclick=ViewTitleInfor(\"" + UserDatumID + "\")>修改</button>  <button class='btn btn-danger btn-sm'type='button' onclick=ViewTitleInfor1(\"" + UserDatumID + "\")>删除</button>";
                }
              
    </script>