花了半天时间研究TABLE

分享 已结 24 2829
午夜惊魂
午夜惊魂 2017-8-29
悬赏:20飞吻
基本功能差不多,现在就是编辑之后,重载表格,跳转到第一页,而不是当前页,不知道如何处理
回帖
  • done - 数据渲染完的回调
    table.render({ //其它参数在此省略
    done: function(res, curr, count){
    //如果是直接赋值的方式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度
    //例如 设置一个隐藏的input
    tableIns.reload({
    where: { //设定异步数据接口的参数
    'page':$('#curr').val();
    }
    });
    }
    });
    比较蠢的方法 解决现存问题 。。快给我20个吻
    0 回复
  • HTML:
    <div>
    <div class="layui-form-item" style="margin-top:20px;margin-left:10px">
    <div class="layui-input-inline">
    <input type="text" id="filter" name="filter" value="" lay-verify="" placeholder="请输入搜索内容" autocomplete="off" class="layui-input">
    </div>
    <button class="layui-btn" id="search" name="search">
    <i class="layui-icon"></i>搜索
    </button>
    <button class="layui-btn layui-btn-normal" id="add">
    <i class="layui-icon"></i>添加
    </button>
    <button class="layui-btn" id="export">
    <i class="layui-icon"></i>导出
    </button>
    <input type="hidden" id="handle_status" />
    </div>
    <div class="divtab">
    <table id="goods" lay-filter="goods"></table>
    </div>
    </div>
    <script type="text/html" id="bar">
    <a class="layui-btn layui-btn-mini" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-mini" lay-event="del">删除</a>
    </script>
    2 回复
  • 前台:
    layui.use(['layer', 'table'], function ()
    {
    var table = layui.table;
    var layer = layui.layer;
    //--------------方法渲染TABLE----------------
    var tableIns = table.render({
    elem: '#goods'
    , url: '@Url.Action("goodsList", "BaseGoods")'
    , cols: [[
    { field: 'id', title: '序号', width: 80, align: 'center' }
    , { field: 'Goods_code', title: '@Html.DisplayNameFor(a => a.Goods_code).ToString().Replace(":", "")', width: 150, sort: true, align: 'center' }
    , { field: 'Goods_name', title: '@Html.DisplayNameFor(a => a.Goods_name).ToString().Replace(":", "")', width: 280, align: 'center' }
    , { field: 'Goods_standard', title: '@Html.DisplayNameFor(a => a.Goods_standard).ToString().Replace(":", "")', width: 603, align: 'center' }
    , { field: 'Goods_model', title: '@Html.DisplayNameFor(a => a.Goods_model).ToString().Replace(":", "")', width: 177, align: 'center' }
    , { field: 'Goods_unit', title: '@Html.DisplayNameFor(a => a.Goods_unit).ToString().Replace(":", "")', sort: true, width: 80, align: 'center' }
    , { field: 'Goods_fax_flag', title: '@Html.DisplayNameFor(a => a.Goods_fax_flag).ToString().Replace(":", "")', sort: true, width: 180, align: 'center' }
    , { fixed: 'right', width: 150, align: 'center', toolbar: '#bar' }
    ]]
    , page: true
    , height: 670
    , limits: [15, 20, 40, 60, 80]
    , limit: 15 //默认采用10
    });
    <script type="text/html" id="bar">
    <a class="layui-btn layui-btn-mini" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-mini" lay-event="del">删除</a>
    </script>
    //工具条事件监听
    table.on('tool(goods)', function (obj)
    { //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"
    var data = obj.data; //获得当前行数据
    console.log(data);
    var layEvent = obj.event; //获得 lay-event 对应的值
    var tr = obj.tr; //获得当前行 tr 的DOM对象
    var goods_code = data.Goods_code;
    if (layEvent === 'del')
    { //删除
    parent.layer.confirm('确定要删除该产品【' + goods_code + '】?', { icon: 3 }, function (index)
    {
    $.ajax({
    url: '@Url.Action("delete","BaseGoods")',
    type: "post",
    data: { goods_code: goods_code },
    dataType: "text",
    success: function (result)
    {
    if (result.length != 0)
    {
    if (result == "ok")
    {
    parent.layer.msg('删除成功', { icon: 1, shade: 0.4, time: 1000 })
    obj.del(); //删除对应行(tr)的DOM结构
    $("#search").click();//重载TABLE
    parent.layer.close(index);
    }
    else if (result == "exist")
    {
    parent.layer.alert("该产品在库存中存在,不能删除", { icon: 5 });
    }
    else if (result == "error")
    {
    parent.layer.msg("删除失败", { icon: 5, shade: [0.4], time: 1000 });
    }
    }
    },
    error: function (error)
    {
    parent.layer.alert(error.responseText, { icon: 2, title: '提示' });
    }
    })
    });
    } else if (layEvent === 'edit')
    { //编辑
    parent.layer.open({
    type: 2,
    title: '编辑产品信息',
    shade: 0.4, //阴影度
    fix: false,
    shadeClose: false,
    maxmin: false,
    area: ['800px;', '540px;'], //窗体大小(宽,高)
    content: '@Url.Action("Edit","BaseGoods")?id=' + goods_code, //传入本层的窗口索引给同级的Iframe
    success: function (layero, index)
    {
    var body = layer.getChildFrame('body', index); //得到产品查询层的BODY
    body.find('#hidValue').val(index); //将本层的窗口索引传给产品查询层的hidValue中
    },
    end: function ()
    {
    var handle_status = $("#handle_status").val();
    console.log(handle_status);
    if (handle_status == 'ok')
    {
    parent.layer.msg('修改成功', { icon: 1, shade: 0.4, time: 1000 });
    $("#search").click();
    $("#handle_status").val('');
    }
    else if (handle_status == "error")
    {
    parent.layer.msg('修改失败', { icon: 5, shade: 0.4, time: 1000 });
    }
    }
    });
    }
    });
    //#region --------------搜索----------------
    $("#search").click(function ()
    {
    var strFilter = $("#filter").val();
    console.log(strFilter);
    tableIns.reload({
    where: {
    filter: strFilter
    }
    });
    });
    //#endregion
    1 回复
  • 后台:
    public string goodsList(string filter, int page, int limit)
    {
    string jsonStr = "";
    try
    {
    int recordCount;
    int pageCount;
    int num;
    string strSql = "select * from wms_base_goods where 1=1 ";
    if (filter != "" && filter != null)
    {
    strSql += "and (";
    strSql += " Goods_code like '%" + filter + "%'";
    strSql += " or Goods_name like '%" + filter + "%'";
    strSql += " or Goods_standard like '%" + filter + "%'";
    strSql += " or Goods_model like '%" + filter + "%'";
    strSql += " or Goods_unit like '%" + filter + "%'";
    strSql += " or Goods_fax_flag like '%" + filter + "%'";
    strSql += ")";
    }
    List<Model.Wms_base_goods> l_goods = b_goods.getGoodsList(strSql, page, out pageCount, out recordCount, limit);
    jsonStr = "{\"code\":0,\"msg\":\"\",\"count\":" + recordCount.ToString() + ",\"data\":[";
    int count = 1;
    if (page == 1)
    num = 0;
    else
    num = (page - 1) * limit;
    foreach (Model.Wms_base_goods goods in l_goods)
    {
    jsonStr += "{\"id\":" + (num + count).ToString();
    jsonStr += ",\"Goods_code\":\"" + goods.Goods_code + "\"";
    jsonStr += ",\"Goods_name\":\"" + goods.Goods_name.Replace('"', '“') + "\"";
    string test = goods.Goods_standard.Replace('"', '“');
    jsonStr += ",\"Goods_standard\":\"" + test.Replace('"', '\"') + "\"";
    jsonStr += ",\"Goods_model\":\"" + goods.Goods_model + "\"";
    jsonStr += ",\"Goods_unit\":\"" + goods.Goods_unit + "\"";
    jsonStr += ",\"Goods_fax_flag\":\"" + goods.Goods_fax_flag + "\"";
    jsonStr += "},";
    count++;
    }
    jsonStr = jsonStr.Remove(jsonStr.Length - 1, 1);
    jsonStr += "]}";
    }
    catch (Exception ex)
    {
    BLL.LogHelper.WriteLog(this.GetType(), ex.ToString());
    }
    return jsonStr;
    }
    1 回复
  • 你好,可以分享一下吗
    0 回复
  • 同问,不知如何设置page和limit 的值
    0 回复
  • @"鑫"有灵犀 基本功能不难,我把前后台代码贴出来
    0 回复
  • @午夜惊魂 楼主 你的前台 HTML呢[嘻嘻]
    0 回复
  • @时光敲醒了流年 一看就是:
    <table id="goods" lay-filter="goods">
    </table>
    0 回复
  • 0 回复
本帖已设置禁止回复