layui.table怎样给td添加select

layui.table怎样给td添加select,第1张

done:function(res,cur,count){

var ct=1

$("tbody td[data-field='robot'] .layui-table-cell").each(function(e,a){

ct++

var arry = new Array()

if(!util.isEmpty(a.innerText)){

arry = a.innerText.split(",")

}

$(a).html($(htmlSelects).attr("xm-select","robot"+ct)[0])

user.formSelects.render('robot' + ct , {

template: function(name, value, selected, disabled){

return value.name  //+ '<span style="position: absolute right: 0 color: #A0A0A0 font-size: 12px">' + name + '</span>'

}

})

user.formSelects.value('robot' + ct, arry)

user.formSelects.on('robot' + ct, function(id, vals, val, isAdd, isDisabled){

//id:           点击select的id

//vals:         当前select已选中的值

//val:          当前select点击的值

//isAdd:        当前 *** 作选中or取消

//isDisabled:   当前选项是否是disabled

//alert("当前选择了: " + JSON.stringify(vals))

var select =$("tbody div select[xm-select="+id+"]")

var tt =select.parent().parent().siblings()

var id=""

tt.each(function(e,a){

if($(a).attr("data-field")=="id") id=$(a).children().html()

})

var arr = new Array()

for ( var i = 0 i <vals.length i++){

arr.push(vals[i].value)

}

user.setRobot(id,arr)

}, true)

})

}

1 2 3 $("select option:selected").attr("自定义属性名")//建议自定义属性名称前加data- 这样更符合html5的规范,例如XXX,这样可以使用另一种方法获取自定义属性的值 $("select option:selected").data("name")//这样可以获取到上面例子中的...

js如下:

///<reference path="jquery-1.8.0.min.js" />

//加载函数

$(function () {

    Nbook.load()

})

var Nbook =

{

    load: function () {

        Nbook.clci()

    },

    selectDat: function () {

        var val

        $.ajax({

            type: "post",

            dataType: "json",

            data: { "method": "selectData", "Name": "'" + $.trim($("#Name").val())+"'" },

            url: "ashx/test.ashx",

            success: function (data) {

                if (data != null) {

                    var html = ""

                    val = eval(data)

                    //console.log(book.length)

                    //for (var i = 0i <book.lengthi++) {

                    //    html += "<ul class='main_Ul'><li>" + book[i].name + "</li><li>" + book[i].sch_id + "</li><li>" + book[i].sex + "</li><li>" + book[i].isOk + "</li></ul>"

                    //}

                    //$(".main").html(html)

                    layui.use('table', function () {

                        var table = layui.table

                        //展示已知数据

                        table.render({

                            elem: '#socialList'

                            , cols: [[ //表头

                                { type: 'checkbox', fixed: 'left' },

                                { field: 'name', title: '姓名', sort: true, fixed: 'left', unresize: true, sort: true, totalRowText: '合计' }

                                , { field: 'sch_id', title: '学校ID', sort: true, totalRow: true }

                                , { field: 'sex', title: '性别', sort: true, totalRow: true }

                                , { field: 'isOk', title: '是否OK' }

                            ]],

                            data: val

                            , even: true

                            , page: true //是否显示分页

                            , toolbar: true //开启工具栏,此处显示默认图标,可以自定义模板,详见文档

                            , limits: [3, 5, 7, 8, 10, 50]

                            , limit: 8 //每页默认显示的数量

                            , cellMinWidth: 80

                            , height: 'full-515'//设置表格最大高度

                            , totalRow: true//开启合计

                        })

                    })

                }

            }

        })

    },

    clci: function ()

    {

        if ($.trim($("#Name").val()) == "")

        {

            Nbook.selectDat()

        }

        $("input[type='button']").click(function () {

            Nbook.selectDat()

        })

    }

}

页面如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="myselect.aspx.cs" Inherits="WebTest.Demos.myselect" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

    <link href="layui-v2.4.5/layui/css/layui.css" type="text/css" rel="stylesheet" />

    <title></title>

    <style type="text/css">

        * {

            margin: 0

            padding: 0

        }

        .main {

            width: 100%

            height: auto

            border: 1px solid #DEDEDE

        }

        .main_Ul {

            float: left

            width: 100%

            height: auto

            border: 1px solid #DEDEDE

            list-style: none

        }

            .main_Ul li {

                float: left

                width: 15%

                height: 25px

                border-right: 1px solid #DEDEDE

            }

    </style>

</head>

<body>

    <form id="form1" runat="server">

        <div class="layui-row">

            <div class="demoTable">

                搜索ID:

                <div class="layui-inline">

                    <input class="layui-input" name="Name" type="text" id="Name" value="" />

                </div>

                <input type="button" class="layui-btn btn" value="搜索" />

            </div>

        </div>

        <table class="layui-hide" id="socialList" lay-filter="socialList"></table>

    </form>

    <script type="text/javascript" src="jquery-1.8.0.min.js"></script>

    <script type="text/javascript" src="layui-v2.4.5/layui/layui.js"></script>

    <script type="text/javascript" src="myselect.js"></script>

</body>

</html>

一般处理程序如下:

using Models

using Newtonsoft.Json

using SqlSugar

using System.Linq

using System.Web

using WebTest.Dao

namespace WebTest.Demos.ashx

{

    /// <summary>

    /// test 的摘要说明

    /// </summary>

    public class test : IHttpHandler

    {

        public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain"

            string method = context.Request.Form["method"]

            string names = context.Request.Form["Name"]

            //names=names != string.Empty ? names : "(1==1)"

            var JsonString = string.Empty

            if (method == "selectData")

            {

                using (var db = SugarDao.GetInstance())

                {

                    //.Where(i =>i.name == names)

                    var student = db.Queryable<Student>().ToList()

                    #region 查询数据

                    JsonString = "["

                    //lambda写法

                    for (int i = 0i <student.Counti++)

                    {

                        JsonString += "{"

                        JsonString += "\"name\":\"" + student[i].name + "\",\"sch_id\":\"" + student[i].sch_id + "\",\"sex\":\"" + student[i].sex + "\",\"isOk\":\"" + student[i].isOk + "\""

                        JsonString = (i == student.Count - 1) ? JsonString += "}" : JsonString += "},"

                    }

                    JsonString += "]"

                    #endregion

                    object jsonob = JsonConvert.SerializeObject(JsonString)

                    context.Response.Write(jsonob)

                }

            }

        }

        public bool IsReusable

        {

            get

            {

                return false

            }

        }

    }

}


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/bake/11850143.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存