常用的一些datatable使用操作

  1. 单击按钮的选中值

//方法名称:获取当前选中的值;icheck-radio change事件;点击事件;
$(“input:radio[name=‘radios’]”).on(‘ifChecked’, function(event){
var cks = $(“input[name=‘radios’]:checked”).val();
if(cks == 1){
$("#items").html("");
$("#items").html(html1);
$("#types").val(1);
}else if(cks == 2){
$("#items").html("");
$("#items").html(html2);
$("#types").val(2);
}
});

2 页面加载后调用

$(window).load(function () {
		$("#items").html(html1);
	});
	
2.2 页面加载时调用
 $(function () {
    var hallType = '${(hallType)!}';
    if(hallType != 2){
        $("#hallType").hide();
    }else{
        $("#hallType").show();
    }
	});

3 datatable 中自适应

$(function () {
//初始化datatable
datatable = $(’#datatable’).DataTable({

        "lengthChange": true,//选择lenth
        "autoWidth": false,//自动宽度
        "searching": false,//搜索
        "processing": false,//loding
        "serverSide": true,//服务器模式
		
        ajax: {
            url: "${basePath}/queue/clientQueueLedArea/list",
            type: "post",
            data: function (d) {
                d.cardId = $("#cardId").val();
                d.orderName = krt.util.camel2Underline(d.columns[d.order[0].column].data);
                d.orderType = d.order[0].dir;
            }
        },	

4 每列给他替换值

		    {
                title: "窗口类型",
                data: "winType",
                render: function (data) {
                    return data == '1' ? '综合窗口' : '单位窗口';
                }
            },
4.2 将多余的字隐藏起来
	{
                title: "业务名称",
                data: "itemName",
                render: function(data, type, raw){
                    var str=data.length>=30?data.substr(0,30)+"......":data;
                    return  '<span title="'+data+'"  class="itemTip">'+str+'</span>';
                }
            },

5 重置表格内容

//重置
    $("#resetBtn").click(function(){
        $(".select2").each(function(){
            $(this).val("").trigger('change');
        });
    });

6 下拉框的改变事件

$("#hallId").change(function(){
        var id = $("#hallId").val();
        krt.ajax({
            type: "POST",
            url: "${basePath}/hall/hallWindow/HallQueueState",
            data: {"id": id},
            success: function (rb) {
                console.log(rb);
                if (rb.data == 2) {
                    $("#hallType").show();
                }else {
                    $("#hallType").hide();
                }
            }
        });
    });

7 得到复选框的值

var rid = $(this).attr('rid');
        var sets = "";
        $("input[name='sets" + rid + "']:checked").each(function (index) {

            if(0==index){
                sets = $(this).val();
            }else{
                sets += (","+$(this).val());                          //‘’党委,省委,市委‘’

            }

        });

8 弹窗
krt.layer.openDialogView(“人员管理”, “${basePath}/msg/msgBook/insertChildUI?id=” + id + “&bookName=” + bookName, “1200px”, “600px”, “”);

9 datatable中下拉框回显

	 {
                    title: "关联大厅",
                    data: "hallId",
                    width: "15%",
                    orderable: false,
                    "render": function (data, type, row) {
                        var hallId = row.id;
                        return '<select class="form-control select2" style="width: 300px" id="hallId' + row.id + '">' +
                            '       <option value="">全部</option>' +
                            '       <#list hallList as list>' +
                            '           <option value="${list.id}" '+ (data ==${list.id}? "selected" : "") +'>${list.names}</option>' +
                            '       </#list>' +
                                '</select>';
                    }
                },

10 datatable中点击事件

//点击datatable中出现点击事件
        $(document).on('click','.orgNameTree',function () {
            var rid = $(this).attr('rid');
            $.layer.open({
                type: 2,
                area: ['20%', '50%'],
                title: "选择上级区域",
                maxmin: true, //开启最大化最小化按钮
                content: "${basePath}/appoint/appointItemRule/orgTreeUI?sValue=" + rid + "&sId=code",
                btn: ['确定', '取消选择', '关闭'],
                yes: function (index, layero) {
                    var tree = layero.find("iframe")[0].contentWindow.tree;
                    var nodes = tree.getSelectedNodes();
                    if (nodes == null || nodes == '') {
                        krt.layer.msg("请选择区域");
                    } else {
                        $("#orgCode"+rid).val(nodes[0].code);
                        $("#orgName"+rid).val(nodes[0].name);
                        krt.layer.close(index);
                    }
                },
                btn2: function () {
                    $("#orgCode"+rid).val("");
                    $("#orgName"+rid).val("");
                },
                cancel: function (index) {
                    krt.layer.close(index);
                }
            });
        });

11 获取所有复选款选中的值

//获取已选中值
        var selArr = [];
        $(".selAll").each(function () {
            if ($(this).prop("checked")) {
                selArr.push($(this).val());
            }
        });

var chk_value =[];//定义一个数组
KaTeX parse error: Expected '}', got 'EOF' at end of input: …chk_value.push((this).val());//将选中的值添加到数组chk_value中
});
var setts = chk_value.join(’,’);
console.log(setts);
d.setts = setts;

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值