Flexigrid系列使用教程（四）同时操作选择的多条数据

Flexigrid系列使用教程（四）同时操作选择的多条数据

一下子写了4篇文章，有点累，本篇中就先贴一下主要代码吧：

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Dialog.Master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<Kwstu.Model.DESYS_STANDEVICE>>" %>

 

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

        <script type="text/javascript">

            $(document).ready(function () {

                //重新定义表格大小

                $(window).resize(function () {

                    var w = $("#content_right").width() - 20;

                    var gh = $("#content_right").height() - 86;

                    $("#grdProList").flexResize(w, gh);

                });

                var maiheight = document.documentElement.clientHeight;

                var w = $("#content_right").width() - 20;

                var gh = $("#content_right").height() - 86;

                var grid = $("#grdProList").flexigrid

          ({

              url: '/BDeviceApply/GetSysSdandeviceFlex',

              dataType: 'json',

              colModel: [

                   { display: 'ID号', name: '', sortable: true, width: 150, align: 'center' },

                   { display: '设备类型', name: 'SORT', sortable: true, width: 80, align: 'center' },

                   { display: '设备名称', name: 'DE_NAME', sortable: true, width: 80, align: 'center' },

                   { display: '备注', name: 'BZ', sortable: true, width: 100, align: 'center' }

                  ],

              buttons: [

                  { name: 'Select', displayname: "选择设备", bclass: 'Add', onpress: toolbarItem_onclick }

                  ],

              ShowToggleCol: true,

              singleSelect: true,

              sortname: 'ID',

              sortorder: 'DESC',

              usepager: true,

              striped: true,

              title: '设备标准库信息列表',

              useRp: true,

              rp: 20,

              rpOptions: [10, 20, 40, 100],

              usepager: true,

              showTableToggleBtn: true,

              showcheckbox: true,//此参数必须要，否则没法实现多选功能

              width: w,

              height: gh,

              pagestat: '显示 {from} 到 {to}， 共 {total} 条',

              procmsg: '请等待数据正在加载中…',

              nomsg: '没有数据',

              onError: '查询出错，请刷新'

          });

 

                function toolbarItem_onclick(cmd, grid) {

                    if (cmd == "Select") {

                        if ($('.trSelected', grid).length == 0) {

                            alert("请选择要选择的设备！");

                        }

                        else {

 

 

                            ifSelect = confirm('是否确认选' + $('.trSelected', grid).length + '条设备吗？')

 

                            if (ifSelect != "0") {

                                var ids = "";

                                $('.trSelected td:nth-child(2)', grid).each(function () {

                                    message = $(this).text();

//处理行数据的Ajax方法，具体方法本文就不贴了，根据需要自己写

                                    var option = {

                                        url: "/BDeviceApply/ConfirmSelect",

                                        type: 'Get',

                                        dataType: 'json',

                                        data: { Message: message }, //发送服务器数据

                                        success: function (data) {  //成功事件

                                            alert("操作成功?");

                                        },

                                        error: function (XMLHttpRequest, textStatus, errorThrown) { //发送失败事件

                                            alert(textStatus);

                                        }

                                    };

                                    //进行异步传输

                                    $.ajax(option);

                                });

                            }

                        }

                    }

                }

            });

    </script>

    <table id="grdProList" style="display: none;">

    </table>

</asp:Content>

 

<asp:Content ID="Content2" ContentPlaceHolderID="menutop" runat="server">

</asp:Content>

 

<asp:Content ID="Content3" ContentPlaceHolderID="menubottem" runat="server">

</asp:Content>

出处：http://www.kwstu.com/ArticleView/lydia_20121031201454418