zoukankan      html  css  js  c++  java
  • JQtable

    /// <reference path="jquery-1.4.1.min.js" />
    //增加插件方法
    jQuery.fn.extend({
        JQtable: function(options, data) {
            //设置控件的总体宽度和样式(位置)
            if (options.width == undefined || options.width == '') {
                options.width = 450;
            }
            this.width = this.width(options.width);
            //this.addClass("JQtabel");
            //添加标题栏-------------------------------------------------------------------
            var T_header = $("<div id='t_header' class='t_header'></div>");
            //设置标题栏的宽度
            T_header.width = T_header.width(options.width);

            var Title = $("<span id='title' class='title'>" + options.title + "</span>");
            //var S_T_P = $("<span id='s_t_p'></span>");
            //var Searchtxt = $("<input type='text' id='searchtxt' class='searchtxt'></intput>");
            //S_T_P.append(Searchtxt);
            // var S_P = $("<span id='s_p'></span>");
            // var Search = $("<input id='search' type='button' class='search'></input>");
            // S_P.append(Search);
            //标题栏中添加内容
            T_header.append(Title)//.append(S_T_P).append(S_P);

            //控件中添加标题栏
            this.append(T_header);
            //动态设置搜索框和搜索按钮的位置
            //window.onload = function() {
            //        if (options.width >= 450) {
            //            var t_w = (options.width - ($("#title").width() + $("s_t_p").width() + $("#s_p").width())) * 2 / 5;
            //            var s_w = (options.width - ($("#title").width() + $("s_t_p").width() + $("#s_p").width())) * 2 / 5;
            //            S_T_P.css({ "position": "relative", "top": "1px", "left": t_w });
            //            S_P.css({ "position": "relative", "top": "3px", "left": s_w });
            //        } else {
            //            S_T_P.css({ "position": "relative", "top": "1px", "right": -20 });
            //            S_P.css({ "position": "relative", "top": "3px", "right": -20 });
            //        }
            // }
            //添加标题栏结束
            //添加查询栏
            //模糊查询和时间查询
            var search_like_eq = $("<div id='search_like_eq' class='search_like_eq'>" +
                                     "<span id='search_le_p' class='search_le_p'><span id='txt_s_l_e' class='txt_s_l_e'></span><input type='text' id='searchtxt' class='searchtxt'></input>" +
                                     "<input type='button' id='search_le' class='search_le' key='' coll_name=''value=''></input><img id='close_le' class='close_le'src='images/close.png''/></span></div>");
            search_like_eq.width = search_like_eq.width(options.width);
            //日期查询
            var search_date = $("<div id='search_date' class='search_date'>" +
                                     "<span style='padding-left:50px;'><span id='txt_date'class='txt_date'></span><input class='Wdate' style='120px;height:18px;' type='text' id='start_date'onClick='WdatePicker()'></input>" +
                                     "-<input class='Wdate' style='120px;height:18px;' type='text' id='end_date'onClick='WdatePicker()'></input>" +
                                     "<input type='button' id='search_dt' class='search_le' coll_name='' isdate='true' value=''></input><img id='close_dt' class='close_dt'src='images/close.png'style='cursor:pointer;'/></span></div>");
            search_date.width = search_date.width(options.width);
            this.append(search_like_eq);
            this.append(search_date);
            //添加Table------------------------------------------------------------------------
            var T_content = $("<div id='t_content'></div>");
            //添加没有数据提示div
            var Nodata = $("<div id='nodata' class='nodata'></div>");
            var N_s = $("<span id='n_txt' class='n_txt'>没有数据!</span>");
            Nodata.append(N_s);


            var table = "<table id='tbResources'  cellspacing='0'  width='" + options.width + "'>";
            //表头行
            var tr_h = "<tr id='tableTitle' align='" + options.header_align + "' class='tableTitle'>";
            //表头列
            var td_h = "";
            //主键列的名称
            var keyname;

            //向Table中添加表头
            for (var i = 0; i < options.fields.length; i++) {
                //获得主键列名称
                if (options.fields[i].key == "true") {
                    keyname = options.fields[i].dataname;
                }
                //是否有复选或单选
                if (i == 0) {
                    if (options.fields[0].type == "checkbox") {
                        //options.fields[i].w的值为列的宽度
                        td_h = td_h + "<td type='checkbox' style='" + options.fields[i].w + "px'>" +
                                      "<input id='checkall' type='checkbox'/></td>"
                        continue;
                    }
                    if (options.fields[0].type == "radio") {
                        td_h = td_h + "<td type='radio' style='" + options.fields[i].w + "px'></td>"
                        continue;
                    }
                    if (options.fields[0].type == "none") {
                        td_h = "";
                        continue;
                    }
                }
                //只有当enable属性值为true 或者没有设置enable属性时都会认为是要显示的列
                if (options.fields[i].enable == undefined || options.fields[i].enable == "true") {
                    //options.fields[i].w 设置列的宽度 options.fields[i].head 为设置列名
                    if (options.fields[i].w != undefined) {//判断这列是否为数据列和是否设置宽度
                        if (options.fields[i].dataname != undefined) {//判断这列是否为数据列
                            if (options.fields[i].issearch != "false")//判断这列是否允许查询
                            {
                                if (options.fields[i].key == "true") {//判断这列是否为主键列
                                    if (options.sortfilename == options.fields[i].dataname) {//判断当前这列是否为默认的排序列
                                        td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                        "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' key='true' d_name='" + options.fields[i].dataname +
                                        "' style='cursor:pointer;' /><img sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    } else {

                                        td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;' >" + options.fields[i].head +
                                        "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' key='true' d_name='" + options.fields[i].dataname +
                                        "' style='cursor:pointer;' /><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    }

                                } else if (options.fields[i].isdate != undefined && options.fields[i].isdate == "true") {//判断这列是否为日期列
                                    if (options.sortfilename == options.fields[i].dataname) {
                                        td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                        "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' isdate='true' d_name='" + options.fields[i].dataname +
                                         "' style='cursor:pointer;' /><img sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    } else {
                                        td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                        "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' isdate='true' d_name='" + options.fields[i].dataname +
                                         "' style='cursor:pointer;' /><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    }
                                }
                                else {
                                    if (options.sortfilename == options.fields[i].dataname) {
                                        td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                                     "</span><img src='images/search.png ' type='search' d_header='" + options.fields[i].head + "' d_name='" + options.fields[i].dataname +
                                                     "' style='cursor:pointer;' /><img sort_name='" + options.fields[i].dataname +
                                                     "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                                     "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    } else {

                                        td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                                     "</span><img src='images/search.png ' type='search' d_header='" + options.fields[i].head + "' d_name='" + options.fields[i].dataname +
                                                     "' style='cursor:pointer;' /><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                                     "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                                     "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    }
                                }
                            } else {
                                if (options.sortfilename == options.fields[i].dataname) {
                                    td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                            "</span><img style='cursor:pointer;' src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                            "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                            "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                } else {
                                    td_h = td_h + "<td style='" + options.fields[i].w + "px'><span style='cursor:pointer;'>" + options.fields[i].head +
                                            "</span><img style='display:none;cursor:pointer;' src='images/sort_desc.png'/><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                            "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                            "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                }
                            }
                        } else {
                            td_h = td_h + "<td style='" + options.fields[i].w + "px'>" + options.fields[i].head + "</td>"
                        }

                    } else {//如果没有设置宽度
                        if (options.fields[i].dataname != undefined) {
                            if (options.fields[i].issearch != "false") {
                                if (options.fields[i].key != undefined) {
                                    if (options.sortfilename == options.fields[i].dataname) {
                                        td_h = td_h + "<td><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                         "' key='true' d_name='" + options.fields[i].dataname +
                                         "' style='cursor:pointer;' /><img sort_name='" + options.fields[i].dataname +
                                         "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                         "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    } else {
                                        td_h = td_h + "<td><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                         "' key='true' d_name='" + options.fields[i].dataname +
                                         "' style='cursor:pointer;' /><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                         "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                         "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    }
                                }
                                else if (options.fields[i].isdate != undefined && options.fields[i].isdate == "true") {
                                    if (options.sortfilename == options.fields[i].dataname) {
                                        td_h = td_h + "<td><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' isdate='true' d_name='" + options.fields[i].dataname +
                                        "' style='cursor:pointer;' /><img sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    } else {
                                        td_h = td_h + "<td><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' isdate='true' d_name='" + options.fields[i].dataname +
                                        "' style='cursor:pointer;' /><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    }
                                } else {
                                    if (options.sortfilename == options.fields[i].dataname) {
                                        td_h = td_h + "<td><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' d_name='" + options.fields[i].dataname +
                                        "' style='cursor:pointer;' /><img sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    } else {
                                        td_h = td_h + "<td><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img src='images/search.png' type='search' d_header='" + options.fields[i].head +
                                        "' d_name='" + options.fields[i].dataname +
                                        "' style='cursor:pointer;' /><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                        "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                        "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                    }
                                }
                            } else {
                                if (options.sortfilename == options.fields[i].dataname) {
                                    td_h = td_h + "<td ><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img sort_name='" + options.fields[i].dataname +
                                    "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                    "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"
                                } else {
                                    td_h = td_h + "<td ><span style='cursor:pointer;'>" + options.fields[i].head + "</span><img style='display:none;'sort_name='" + options.fields[i].dataname +
                                    "' type='desc'  src='images/sort_desc.png'/><img sort_name='" + options.fields[i].dataname +
                                    "' type='asc' style='display:none;' src='images/sort_asc.png'/></td>"

                                }
                            }
                        } else {
                            td_h = td_h + "<td >" + options.fields[i].head + "</td>"
                        }

                    }

                }
                //             else {    //如果在不用显示的列中有一列是主键列 那么也会将它渲染的到页面 只是隐藏了该列
                //                if (options.fields[i].key == "true" && options.fields[i].key != undefined) {   //如果为主键列
                //                    if (options.fields[i].w != undefined) {
                //                        td_h = td_h + "<td style='" + options.fields[i].w + "px;display:none;'>" + options.fields[i].head + "</td>"
                //                    }
                //                    else {
                //                        td_h = td_h + "<td style='display:none;' >" + options.fields[i].head + "</td>"
                //                    }
                //                }
                //            }
            };
            tr_h = tr_h + td_h + "</tr>";
            table = table + tr_h;
            //向table添加表头结束
            //-------------------------------------------------------------------------------------------------
            //向table添加表的数据
            var tr_c = ""; //数据行
            var td_c = ""; //数据列
            var flag_init = false;
            var obj = this;

            jQuery.extend({//截取字符串长度
                cutstr: function(str, len) {
                    var str_length = 0;
                    var str_len = 0;
                    str_cut = new String();
                    str_len = str.length;
                    for (var i = 0; i < str_len; i++) {
                        a = str.charAt(i);
                        str_length++;
                        if (escape(a).length > 4) {
                            //中文字符的长度经编码之后大于4  
                            str_length++;
                        }
                        str_cut = str_cut.concat(a);
                        if (str_length > len) {
                            str_cut = str_cut.concat("...");
                            return str_cut;
                        }
                    }
                    //如果给定字符串小于指定长度,则返回源字符串;  
                    if (str_length <= len) {
                        return str;
                    }
                }
            });


            jQuery.extend({//封装根据数据创建表格的行方法
                create_tr: function(options, data) {
                    //如果没有数据
                    if (data.totalcount == undefined || data.datas == undefined || data.totalcount == 0) {
                        // $("#nodata").remove();  //清除没有数据提示div
                        flag_init = true;
                        var tr_null = "";
                        for (var i = 0; i < options.pagesize; i++) {//如果返回数据为空则用空行填充
                            tr_null = tr_null + "<tr style='height:30px;background-color:#444444;'></tr>";
                        }
                        table = table + tr_null + "</table>";
                        T_content.append(table);
                        obj.append(T_content);
                        //obj.append(Nodata); //没有数据提示信息
                        //Nodata.show();

                    }
                    else //如果有数据
                    {
                        //$("#nodata").remove();  //清除没有数据提示div
                        //循环取出数据
                        for (var k = 0; k < data.datas.length; k++) {
                            //data.datas[k][keyname]获得主键列的值并赋值给每一行的id
                            var o = "<tr id='" + data.datas[k][keyname] + "' align='center' style='height:30px;'>";
                            if (options.fields[0].type == "checkbox") {
                                td_c = "<td ><input name='subbox' value='" + data.datas[k][keyname] + "'  type='checkbox'/></td>"
                            }
                            if (options.fields[0].type == "radio") {
                                td_c = "<td ><input name='radio' value='" + data.datas[k][keyname] + "' type='radio' /></td>"
                            }
                            if (options.fields[0].type == "none") {
                                td_c = "";
                            }

                            //给数据列渲染数据
                            var h = 0;
                            for (var j = 1; j < options.fields.length; j++) {//j=1 因为第一例不为数据列
                                //判断该列是否显示
                                if (options.fields[j].enable == undefined || options.fields[j].enable == "true") {
                                    //判断是否为数据列
                                    if (options.fields[j].dataname != undefined) {
                                        h = j;  //获得最后一个数据列的索引并赋值给h
                                        var dataname = options.fields[j].dataname;
                                        var str_len = data.datas[k][dataname].toString();
                                        var s_len = jQuery.cutstr(str_len, options.showchar);
                                        if (options.fields[j].align == "left" || options.fields[j].align == "center" || options.fields[j].align == "right") {
                                            td_c = td_c + "<td title='" + data.datas[k][dataname].toString() +
                                            "' align='" + options.fields[j].align + "' >" + s_len + "</td>";
                                        } else {
                                            td_c = td_c + "<td title='" + data.datas[k][dataname].toString() +
                                            "'>" + s_len + "</td>";
                                        }

                                    }
                                }
                                //                     else
                                //                    {    //如果该列为主键列则渲染,但是隐藏它
                                //                        if (options.fields[j].key == "true")
                                //                         {
                                //                            var dataname = options.fields[j].dataname;
                                //                            td_c = td_c + "<td style='display:none;' >" + data.datas[k][dataname] + "</td>";
                                //                         }
                                //                    }
                            }
                            //给操作列渲染图片
                            for (var n = h + 1; n < options.fields.length; n++) {
                                //操作列
                                // if (options.fields[n].type == "delete") {
                                if (options.fields[n].enable != "false" || options.fields[n].enable == "true") {
                                    //td_c = td_c + "<td style='border:none;' ><img id='delete' type='delete' src='images/delete.png' style='cursor:pointer;' /></td>";
                                    if (options.fields[n].align == "left" || options.fields[n].align == "center" || options.fields[n].align == "right") {
                                        td_c = td_c + "<td style='border:none;'align='" + options.fields[n].align + "' ><a href='#' id='" + options.fields[n].type + "'>" + options.fields[n].head + "</a></td>"
                                    } else {

                                        td_c = td_c + "<td style='border:none;' ><a href='#' id='" + options.fields[n].type + "'>" + options.fields[n].head + "</a></td>"
                                    }
                                }
                                // }
                                //编辑列
                                //                            if (options.fields[n].type == "editor") {
                                //                                if (options.fields[n].enable != "false" || options.fields[n].enable == "true") {
                                //                                    td_c = td_c + "<td style='border:none;'><img id='editor' type='editor' src='images/editor.png' style='cursor:pointer;' /></td>"
                                //                                }
                                //                            }
                                //查看列
                                //                            if (options.fields[n].type == "view") {
                                //                                if (options.fields[n].enable != "false" || options.fields[n].enable == "true") {
                                //                                    td_c = td_c + "<td style='border:none;'><img id='view' type='view' src='images/view.png' style='cursor:pointer;' /></td>";
                                //                                }
                                //                            }
                            }
                            //渲染完一行
                            tr_c = tr_c + o + td_c + "</tr>";
                        }
                        if (data.datas.length < options.pagesize) { //如果返回的数据条数小于pagesize则用空行填充
                            if ($.browser.version == 7.0) {//判断是否为iE7
                                for (var i = 0; i < options.pagesize - data.datas.length; i++) {
                                    tr_c = tr_c + "<tr style='height:32px;'></tr>";
                                }
                            } else {
                                for (var i = 0; i < options.pagesize - data.datas.length; i++) {
                                    tr_c = tr_c + "<tr style='height:30px;'></tr>";
                                }
                            }
                        }
                    }
                }
            });

            jQuery.create_tr(options, data); //调用动态创建行函数
            if (!flag_init) {//当初始化进来数据为空时则不执行里面的代码
                table = table + tr_c + "</table>";
                T_content.append(table);
                this.append(T_content);
            }


            jQuery.extend({ //封装表格的行和列背景色方法
                t_color: function() {
                    /*--统一表格样式--*/
                    var color = ["#f19b38", "#f8ba17", "#95ac26", "#569e32", "#69BDD0", "#9DA7C3", "#EB5C1E", "#69BDB0", "#69BBB0"];
                    $("#tableTitle").each(function() {
                        $(this).children().each(function(i) {
                            $(this).css("background-color", color[i]);
                        });
                    });
                    /*--td着色---------*/
                    $("#tbResources").find("tr").not($("#tableTitle")).each(function(i) {
                        if (i % 2 == 0) {
                            $(this).css("background-color", "#f6f6f6").children().each(function(j) {
                                if (j % 2 == 1) {
                                    $(this).css("background-color", "#eeeeee");
                                }
                            });
                        }
                    });
                    /*--设置表格样式结束----*/
                }
            });
            jQuery.t_color();
            //添加table结束-------------------------------------------------------------------------------------------------

            //添加分页控件
            var T_page = $("<div id='t_page' class='t_page'></div>");
            T_page.width = T_page.width(options.width);
            var P_refresh = $("<span id='p_refresh' class='p_refresh'></span>");
            var Refresh = $("<img id='refresh' alt='刷新' src='images/refresh.png' style='cursor:pointer; 30px;'/>");
            var P_Pageindex = $("<span id='p_pageindex' class='p_pageindex' 30px;></span>");
            var Pageindex = $("<span id='home' style='margin-left:3px;30px;'>首页</span>" +
                             "<span id='pre' style='margin-left:3px;30px;'>上一页</span>" +
                             "<span id='next' style='margin-left:3px;30px;'>下一页</span>" +
                             "<span id='last' style='margin-left:3px;30px;'>末页</span>" +
                             "<span style='margin-left:8px;'>当前:<span id='current'></span>页</span></span>" +
                             "<span style='margin-left:8px;'>共:<span id='totalall'></span>条</span>");
            P_Pageindex.append(Pageindex);
            P_refresh.append(Refresh);
            T_page.append(P_refresh).append(P_Pageindex);
            this.append(T_page);
            //添加loading图片
            var t_loading = $("<div id='load' style='display:none;z-index:1005;'><img id='loading'src='images/loading.gif'/></div>");
            var page_top = $("#p_pageindex").offset().top;
            var this_top = this.offset().top;
            var this_left = this.offset().left;
            //alert(this_left)
            var page_left = $("#p_pageindex").offset().left;
            //alert(page_left);
            this.append(t_loading);
            $("#load").css({ "position": "relative", "top": -(parseInt(page_top) - parseInt(this_top)) / 2 + "px", "left": ((page_left - this_left) + 180) + "px" });
            $("#load").ajaxStart(function() {
                $(this).show();
            });

            $("#load").ajaxStop(function() {
                $(this).hide();
            });


            //更新每次的总页数
            var t_a_p;
            //声明总记录数
            var total_count = data.totalcount;
            //当前页默认为1
            var curentpage = 1;
            //没有数据时显示的总条数
            var nodata_tag=false;
           
            //刷新和分页和查询ajax方法
            jQuery.extend({
                ajax_home_refresh: function(strwhere, pageindex, sortfilename) {
                    $.ajax({
                        type: "post",
                        contentType: "application/json;utf-8",
                        datatype: "json",
                        url: options.actions.selectAction,
                        data: "{'strwhere':\"" + strwhere + "\",'pagesize':" + options.pagesize + ",'pageindex':" + pageindex + ",'sortfilename':\"" + sortfilename + "\"}",
                        success: function(sqldata) {
                            //清除数据行
                            $("#tbResources").find("tr").each(function(i) {
                                if (i > 0) {
                                    $(this).remove();
                                }
                            });
                            var sdata = eval("(" + sqldata.d + ")");
                            if (sdata.totalcount == undefined || sdata.datas == undefined || sdata.totalcount == 0) {
                                nodata_tag=true;//标记是否有数据
                                total_count = 1;
                                var tr_null = ""; //如果返回数据为空则用空行填充
                                for (var i = 0; i < options.pagesize; i++) {
                                    tr_null = tr_null + "<tr style='height:30px;'></tr>";
                                }
                                $(tr_null).insertAfter($("#tableTitle"))//把没有数据提示div插入到表头之后
                                //Nodata.show(); //显示
                                jQuery.curent_page();
                            } else {
                                nodata_tag=false;//标记是否有数据
                                //重新创建数据行
                                total_count = sdata.totalcount;
                                tr_c = "";
                                jQuery.create_tr(options, sdata);
                                $("#tbResources").append(tr_c);
                                jQuery.t_color(); //添加表格颜色
                                jQuery.hover_backgroundcolor(); //重新添加鼠标移入背景色
                                jQuery.curent_page(); //重新计算当前页显示的值
                            }
                        },
                        error: function(err) {
                            alert(err);
                        }
                    });

                }
            });

            jQuery.extend({//封装计算当前页显示值的方法
                curent_page: function() {
                    //总计多少页
                    var total_page;
                    if (total_count % options.pagesize > 0) {
                        total_page = parseInt(total_count / options.pagesize) + 1;
                    } else {
                        total_page = parseInt(total_count / options.pagesize)
                    }

                    $("#current").text(curentpage + "/" + total_page); //当前显示的页数
                    if(nodata_tag){
                      $("#totalall").text("0"); //显示总的数据条数
                    }else{
                      $("#totalall").text(total_count); //显示总的数据条数
                    }
                   
                    t_a_p = total_page;
                    if (total_page == 1) {
                        $("#home").addClass("page_1");
                        $("#pre").addClass("page_1");
                        $("#next").addClass("page_1");
                        $("#last").addClass("page_1");

                    } else {
                        if (curentpage == 1) {
                            $("#home").addClass("page_1");
                            $("#pre").addClass("page_1");
                        }

                        if (curentpage != t_a_p) {

                            $("#next").removeClass("page_1");
                            $("#last").removeClass("page_1");
                        }
                    }

                }
            });
            jQuery.curent_page();
            //计算当前页结束
            //当鼠标移入分页栏添加背景
            $("#refresh").hover(//刷新
                  function() {
                      $(this).addClass("bg_page");
                  },
                  function() {
                      $(this).removeClass("bg_page");
                  }
               );
            $("#home").hover( //首页
                 function() {
                     if (t_a_p != 1 && curentpage != 1) {
                        $(this).addClass("bg_page");
                     }
                 },
                  function() {
                      $(this).removeClass("bg_page");
                  }
               );

            $("#pre").hover(//上一页
                 function() {
                     if (t_a_p != 1 && curentpage != 1) {
                         $(this).addClass("bg_page");
                     }
                 },
                  function() {
                      $(this).removeClass("bg_page");
                  }
               );

            $("#next").hover(//下一页
                 function() {
                     if (t_a_p != 1 && curentpage != t_a_p) {
                         $(this).addClass("bg_page");
                     }

                 },
                  function() {
                      $(this).removeClass("bg_page");
                  }
               );
            $("#last").hover(//末页
                 function() {
                     if (t_a_p != 1 && curentpage != t_a_p) {
                         $(this).addClass("bg_page");
                     }
                 },
                  function() {
                      $(this).removeClass("bg_page");
                  }
               );

            //当鼠标移入分页栏添加背景结束
            //模糊查询事件
            //        $("#search").click(function () {
            //            curentpage = 1;
            //            //获得查询条件
            //            var strwhere = $("#searchtxt").val();
            //            if (strwhere.length > 0) {
            //                jQuery.ajax_home_refresh(strwhere, 1);
            //            }
            //        });
            //模糊查询事件结束
            var tag = 0; //默认值为0 表示当前数据为初始化数据 1表示当前为主键查询或模糊查询 2表示当前为按日期查询数据
            var sort_name = options.sortfilename;  //默认的排序字段
            var sort_type = "desc";   //默认为降序排序类型
            //首页事件
            $("#home").click(function() {
                //获得查询条件
                var strwhere = '';
                var sortfilename = "order by " + sort_name + " " + sort_type;
                var val = $("#searchtxt").val();
                var start_date = $("#start_date").val();
                var end_date = $("#end_date").val();
                if (tag == 0 && curentpage > 1) {
                    jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                }
                if (tag == 1 && curentpage > 1) {
                    var col_name = $("#search_le").attr("coll_name");
                    strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                    jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                }
                if (tag == 2 && curentpage > 1) {
                    var start_date = $("#start_date").val();
                    var end_date = $("#end_date").val();
                    var col_name = $("#search_dt").attr("coll_name");
                    var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                    if (jQuery.compareDate(start_date, end_date)) {
                        jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                    }
                }
                curentpage = 1;
            });
            //首页事件结束

            //刷新事件开始
            $("#refresh").click(function() {
                curentpage = 1;
                sort_name = options.sortfilename; //刷新的时候取默认排序列

                $("img[type='asc']").each(function() {//隐藏所有升序按钮
                    $(this).css("display", "none");
                });
                $("img[type='desc']").each(function() {//隐藏所有降序按钮
                    $(this).css("display", "none");
                });
                $("#tableTitle").find("img").each(function() {//让默认排序列的排序图标显示
                    if ($(this).attr("sort_name") == sort_name) {
                        if ($(this).attr("type") == "desc") {
                            $(this).css("display", "");
                        }
                    }
                });
                $("#start_date").val('');
                $("#end_date").val('');
                $("#search_date").hide();
                $("#searchtxt").val('');
                $("#search_like_eq").hide();
                var sortfilename = "order by " + sort_name + " desc";
                jQuery.ajax_home_refresh('', 1, sortfilename);
            });
            //刷新事件结束

            //上一页事件
            $("#pre").click(function() {
                //获得查询条件
                if (curentpage - 1 >= 0) {
                    curentpage = curentpage - 1;
                }
                var strwhere = '';
                var sortfilename = "order by " + sort_name + " " + sort_type;
                var val = $("#searchtxt").val();
                var start_date = $("#start_date").val();
                var end_date = $("#end_date").val();
                if (tag == 0 && curentpage > 0) {
                    jQuery.ajax_home_refresh(strwhere, curentpage, sortfilename);
                }
                if (tag == 1 && curentpage > 0) {
                    var col_name = $("#search_le").attr("coll_name");
                    strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                    jQuery.ajax_home_refresh(strwhere, curentpage, sortfilename);
                }
                if (tag == 2 && curentpage > 0) {
                    var start_date = $("#start_date").val();
                    var end_date = $("#end_date").val();
                    var col_name = $("#search_dt").attr("coll_name");
                    var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                    if (jQuery.compareDate(start_date, end_date)) {
                        jQuery.ajax_home_refresh(strwhere, curentpage, sortfilename);
                    }
                }
            });
            //上一页事件结束

            //下一页事件
            $("#next").click(function() {
                //获得查询条件
                curentpage = curentpage + 1;
                var strwhere = '';
                var sortfilename = "order by " + sort_name + " " + sort_type;
                var val = $("#searchtxt").val();
                var start_date = $("#start_date").val();
                var end_date = $("#end_date").val();
                if (tag == 0 && curentpage <= t_a_p) {
                    jQuery.ajax_home_refresh(strwhere, curentpage, sortfilename);
                } else if (tag == 1 && curentpage <= t_a_p) {
                    var col_name = $("#search_le").attr("coll_name");
                    strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                    jQuery.ajax_home_refresh(strwhere, curentpage, sortfilename);
                } else if (tag == 2 && curentpage <= t_a_p) {
                    var start_date = $("#start_date").val();
                    var end_date = $("#end_date").val();
                    var col_name = $("#search_dt").attr("coll_name");
                    var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                    if (jQuery.compareDate(start_date, end_date)) {
                        jQuery.ajax_home_refresh(strwhere, curentpage, sortfilename);
                    }
                } else {
                    curentpage = curentpage - 1;
                }
                if (curentpage != 1) {
                    $("#home").removeClass("page_1");
                    $("#pre").removeClass("page_1");
                }

                if (curentpage == t_a_p) {
                    $("#next").addClass("page_1");
                    $("#last").addClass("page_1");
                }
            });
            //下一页事件结束

            //末页事件
            $("#last").click(function() {

                //获得查询条件
                curentpage++;
                var strwhere = '';
                var sortfilename = "order by " + sort_name + " " + sort_type;
                var val = $("#searchtxt").val();
                var start_date = $("#start_date").val();
                var end_date = $("#end_date").val();
                if (tag == 0 && curentpage <= t_a_p) {
                    jQuery.ajax_home_refresh(strwhere, t_a_p, sortfilename);
                }
                if (tag == 1 && curentpage <= t_a_p) {
                    var col_name = $("#search_le").attr("coll_name");
                    strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                    jQuery.ajax_home_refresh(strwhere, t_a_p, sortfilename);
                }
                if (tag == 2 && curentpage <= t_a_p) {
                    var start_date = $("#start_date").val();
                    var end_date = $("#end_date").val();
                    var col_name = $("#search_dt").attr("coll_name");
                    var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                    if (jQuery.compareDate(start_date, end_date)) {
                        jQuery.ajax_home_refresh(strwhere, t_a_p, sortfilename);
                    }
                }

                curentpage = t_a_p;
                if (t_a_p != 1) {
                    $("#home").removeClass("page_1");
                    $("#pre").removeClass("page_1");
                }
                $("#next").addClass("page_1");
                $("#last").addClass("page_1");
            });
            //末页事件结束

            //搜索功能--显示或隐藏搜索框
            $("#tableTitle").find("img").each(function() {
                var obj_img = $(this);
                $(obj_img).click(function() {
                    if ($(this).attr("type") == "search") {
                        if ($(this).attr("key") == "true") {
                            tag = 1; //表示当前数据为模糊查询数据
                            $("#searchtxt").val('');
                            $("#txt_s_l_e").text($(this).attr("d_header") + ":");
                            $("#search_date").css("display", "none");
                            $("#search_like_eq").css("display", "block");
                            $("#search_le").attr("key", "true");
                            $("#search_le").attr("coll_name", $(this).attr("d_name"));
                        } else if ($(this).attr("isdate") == "true") {
                            tag = 2; //表示当前数据为日期查询数据
                            $("#start_date").val('');
                            $("#end_date").val('');
                            $("#txt_date").text($(this).attr("d_header") + ":");
                            $("#search_like_eq").css("display", "none");
                            $("#search_date").css("display", "block");
                            $("#search_dt").attr("coll_name", $(this).attr("d_name"));
                        } else {
                            tag = 1; //表示当前数据为模糊查询数据
                            $("#searchtxt").val('');
                            $("#txt_s_l_e").text($(this).attr("d_header") + ":");
                            $("#search_date").css("display", "none");
                            $("#search_like_eq").css("display", "block");
                            $("#search_le").attr("key", "false");
                            $("#search_le").attr("coll_name", $(this).attr("d_name"));
                        }
                    }
                });
            });
            //关闭日期查询框
            $("#close_dt").click(function() {
                tag = 0;
                $("#start_date").val('');
                $("#end_date").val('');
                $("#search_date").hide();
            });
            //关闭模糊查询框
            $("#close_le").click(function() {
                tag = 0;
                $("#searchtxt").val('');
                $("#search_like_eq").hide();
            });
            //封装比较时间的方法 结束日期比开始日期大返回true
            jQuery.extend({
                compareDate: function(startDate, endDate) {
                    var d1 = new Date(startDate.replace(/-/g, "/"));
                    var d2 = new Date(endDate.replace(/-/g, "/"));
                    var time = d2.getTime() - d1.getTime();
                    var days = parseInt(time / (1000 * 60 * 60 * 24));
                    if (days >= 0)
                        return true;
                    else
                        return false;
                }
            });
            //搜索功能-------搜索
            $("#search_le").click(function() {//模糊查询
                curentpage = 1;
                var sortfilename = "";
                if ($(this).attr("key") == "true") {
                    var val = $("#searchtxt").val();
                    var col_name = $(this).attr("coll_name");
                    var strwhere = ' and ' + col_name + '=' + val;
                    sortfilename = "order by " + sort_name + " " + sort_type;
                    if (val.length > 0) {
                        jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                    }
                } else {
                    var val = $("#searchtxt").val();
                    var col_name = $(this).attr("coll_name");
                    var strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                    sortfilename = "order by " + sort_name + " " + sort_type;
                    if (val.length > 0) {
                        jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                    }
                }
            });
            $("#search_dt").click(function() {
                curentpage = 1;
                var start_date = $("#start_date").val();
                var end_date = $("#end_date").val();
                var col_name = $(this).attr("coll_name");
                var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                var sortfilename = "order by " + sort_name + " " + sort_type;
                if (jQuery.compareDate(start_date, end_date)) {
                    jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                } else {
                    alert('开始日期应小于结束日期!');
                }
            });
            //给表格的行添加鼠标移入移除设置背景色
            jQuery.extend({
                hover_backgroundcolor: function() {
                    $("#tbResources").find("tr:gt(0)").mouseover(function() { $(this).css("background-color", "#f6f6f6"); })
                                              .mouseout(function() { $(this).css("background-color", ""); });
                }
            });
            jQuery.hover_backgroundcolor();

            //排序功能
            //点击表头文本事件
            var sort_tag = "desc";
            $("#tableTitle").find("td").each(function() {
                $(this).find("span").click(function() {
                    $("#tableTitle").find("td").each(function() {
                        $(this).find("span").next().next().next().css("display", "none");
                        $(this).find("span").next().next().css("display", "none");
                    });
                    //升序
                    if (sort_tag == "desc") {
                        curentpage = 1;
                        $(this).next().next().next().css("display", "");
                        $(this).next().next().css("display", "none");
                        sort_name = $(this).next().next().attr("sort_name"); //获得当前排序的列
                        sort_type = "asc";  //获得当前排序的类型
                        var strwhere = '';
                        var sortfilename = "order by " + sort_name + " asc";
                        var val = $("#searchtxt").val();
                        var start_date = $("#start_date").val();
                        var end_date = $("#end_date").val();
                        if (tag == 0) {
                            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                        }
                        if (tag == 1) {
                            var col_name = $("#search_le").attr("coll_name");
                            strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                        }
                        if (tag == 2) {
                            var start_date = $("#start_date").val();
                            var end_date = $("#end_date").val();
                            var col_name = $("#search_dt").attr("coll_name");
                            var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                            if (jQuery.compareDate(start_date, end_date)) {
                                jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                            }
                        }
                        sort_tag = "asc";
                    }
                    //-------------------------------
                    //降序
                    else {
                        curentpage = 1;
                        $(this).next().next().next().css("display", "none");
                        $(this).next().next().css("display", "");
                        sort_name = $(this).next().next().attr("sort_name")
                        sort_type = "desc";
                        var strwhere = '';
                        var sortfilename = "order by " + sort_name + " desc";
                        var val = $("#searchtxt").val();
                        var start_date = $("#start_date").val();
                        var end_date = $("#end_date").val();
                        if (tag == 0) {
                            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                        }
                        if (tag == 1) {
                            var col_name = $("#search_le").attr("coll_name");
                            strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
                            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                        }
                        if (tag == 2) {
                            var start_date = $("#start_date").val();
                            var end_date = $("#end_date").val();
                            var col_name = $("#search_dt").attr("coll_name");
                            var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
                            if (jQuery.compareDate(start_date, end_date)) {
                                jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
                            }
                        }
                        sort_tag = "desc";
                    }
                    //--------------------------------
                });
            });
            /* //升序
            $("img[type='asc']").each(function() {
            $(this).click(function() {
            curentpage = 1;
            $(this).css("display", "none");
            $(this).prev().css("display", "");
            sort_name = $(this).attr("sort_name"); //获得当前排序的列
            sort_type = "asc";  //获得当前排序的类型
            var strwhere = '';
            var sortfilename = "order by " + sort_name + " asc";
            var val = $("#searchtxt").val();
            var start_date = $("#start_date").val();
            var end_date = $("#end_date").val();
            if (tag == 0) {
            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
            }
            if (tag == 1) {
            var col_name = $("#search_le").attr("coll_name");
            strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
            }
            if (tag == 2) {
            var start_date = $("#start_date").val();
            var end_date = $("#end_date").val();
            var col_name = $("#search_dt").attr("coll_name");
            var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
            if (jQuery.compareDate(start_date, end_date)) {
            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
            }
            }
            });
            });
            //降序
            $("img[type='desc']").each(function() {
            $(this).click(function() {
            curentpage = 1;
            $(this).css("display", "none");
            $(this).next().css("display", "");
            sort_name = $(this).attr("sort_name");
            sort_type = "desc";
            var strwhere = '';
            var sortfilename = "order by " + sort_name + " desc";
            var val = $("#searchtxt").val();
            var start_date = $("#start_date").val();
            var end_date = $("#end_date").val();
            if (tag == 0) {
            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
            }
            if (tag == 1) {
            var col_name = $("#search_le").attr("coll_name");
            strwhere = 'and ' + col_name + ' like \'\%' + val + '\%\' ';
            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
            }
            if (tag == 2) {
            var start_date = $("#start_date").val();
            var end_date = $("#end_date").val();
            var col_name = $("#search_dt").attr("coll_name");
            var strwhere = 'and ' + col_name + ' between\'' + start_date + '\' and \'' + end_date + '\'';
            if (jQuery.compareDate(start_date, end_date)) {
            jQuery.ajax_home_refresh(strwhere, 1, sortfilename);
            }
            }

                });
            });
            */
        }
    });

  • 相关阅读:
    201671010112 第十四周 Swing用户界面组件
    201671010112 第十二周
    201671010112 第十二周—— “如何在eclipse中重定向标准输入到文件?”整理方案
    201671010112 第十一周
    201671010112 第十周
    201671010112 第九周
    201671010112 第八周
    201671010112 第六周
    面向对象的程序设计课程进度
    201671010111 2016-2017-2《面向对象的程序设计》 java学习总结
  • 原文地址:https://www.cnblogs.com/zcttxs/p/2660609.html
Copyright © 2011-2022 走看看