"가 바로 Can입니다."/> "가 바로 Can입니다.">
찾다

집 >웹 프론트엔드 >레이이 튜토리얼 >Layui 테이블 페이지 매김이 적용되지 않으면 어떻게 해야 합니까?

Layui 테이블 페이지 매김이 적용되지 않으면 어떻게 해야 합니까?

藏色散人
藏色散人원래의
2020-11-19 11:46:188284검색

layui 테이블 페이징이 작동하지 않는 이유에 대한 해결 방법: 먼저 해당 코드 파일을 연 다음 동적으로 코드를 "var dom = $("

Layui 테이블 페이지 매김이 적용되지 않으면 어떻게 해야 합니까?

이 튜토리얼의 운영 환경: Windows 7 시스템,layui 버전 2.5.6 이 방법은 모든 브랜드의 컴퓨터에 적합합니다. "

layUI tutorial

"

Layui 레이어에서 테이블을 연 후 페이징이 유효하지 않은 문제 해결 방법

1. 원본 코드: 

<body>
<div id="showalladdableavms" style="display: none;width:100%">
    <table id="demo" lay-filter="test"></table>
</div> -->
</body>
<script>
filldata(table,"#demo","getDateForUserJurisdiction.gds");
layer.open({
                               type:1,
                               title:"添加机器",
                               maxmin:true,
                               area:["100%","100%"],
                               btn:["确认添加"],
                               content: $("#showalladdableavms").html(),
                               success: function (layero) {
                              var btn = layero.find(&#39;.layui-layer-btn&#39;);
                              btn.css({&#39;position&#39;:&#39;relative&#39;,&#39;top&#39;:"-93%","text-align":"left","left":"8%"});
                              },
                              btn1:function(index, layero){
                                  //console.log(layero, index);
                                  var res = getoperavms(&#39;demo&#39;);
                                  console.dir(res)
                              }
                             });
function filldata(table,id,url){
              table.render({
                  elem: id,
                  height:"560"
                  ,url:url //数据接口
                  ,method: &#39;POST&#39;
                  ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                  ,page:true/*  { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                            first: true //显示首页
                           ,last: true //显示尾页
                  } */
                   ,limits : [10,20,30]
                   ,limit:10
                  ,request: {
                    pageName: &#39;page&#39;,//页码的参数名称，默认：page
                  } 
                  ,cols: [[ //表头
                             {checkbox:true} 
                          ,{field: &#39;id&#39;, title: &#39;ID&#39;, width:80, sort: true}
                          ,{field: &#39;avm&#39;, title: &#39;机器编号&#39;, width:80}
                          ,{field: &#39;company&#39;, title: &#39;公司名称&#39;, width:80}
                          ,{field: &#39;area&#39;, title: &#39;区域&#39;, width:80, sort: true}
                          ,{field: &#39;circuit&#39;, title: &#39;线路&#39;, width:80} 
                          ,{field: &#39;position&#39;, title: &#39;位置&#39;, width: 177}
                          ,{field: &#39;goodsxml&#39;, title: &#39;商品库&#39;, width: 80, sort: true}
                          
                        ]]
                  ,where : {
                  //传值 startDate : startDate,
                          allavm:&#39;yes&#39;
                    }
                  ,response: {
                         // statusName: &#39;code&#39; //数据状态的字段名称，默认：code
                         //,statusCode: 200 //成功的状态码，默认：0
                         //,msgName: &#39;message&#39; //状态信息的字段名称，默认：msg
                         countName: &#39;total&#39; //数据总数的字段名称，默认：count
                         ,dataName: &#39;rows&#39; //数据列表的字段名称，默认：data
                        }
                   /* done:function(){
                             layer.open({
                                   type:1,
                                   maxmin:true,
                                   area:["800px","600px"],
                                   content: $("#showalladdableavms")
                                 });
                             } */
                 });
        }
</script>

2. 이후 페이징, 선택 상자 등이 작동하지 않습니다. 확인해 보니 html()로 얻은 dom 객체가 손실된다고 하는데, dom을 직접 사용하면 dom 내용이 표시되지 않는 문제가 발생합니다.

3. 

var dom = $("<div id=&#39;showalladdableavms&#39; style=&#39;display:none;width:100%&#39;><table id=&#39;demo&#39; lay-filter=&#39;test&#39;></table></div>");
$(&#39;body&#39;).append(dom)

이 방법은 페이지에 작성된 DOM 개체를 여는 문제를 효과적으로 해결할 수 있으며, 어두운 회색 톤 문제와 동시에 DOM 개체 이벤트도 지원됩니다. 완벽합니다

위 내용은 Layui 테이블 페이지 매김이 적용되지 않으면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

layui html var 对象 事件 dom display table
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사：Layui에서 데이터 바인딩을 구현하는 방법다음 기사：Layui에서 데이터 바인딩을 구현하는 방법

관련 기사

더보기