Question

 function CustomizeGrid() {
        debugger;
          var wrapper = this.wrapper,
              header = wrapper.find(".k-grid-header");

          function resizeFixed() {
              var paddingRight = parseInt(header.css("padding-right"));
              header.css("width", wrapper.width() - paddingRight);
          }

          function scrollFixed() {
              var offset = $(this).scrollTop(),
                  tableOffsetTop = wrapper.offset().top,
                  tableOffsetBottom = tableOffsetTop + wrapper.height() - header.height();
              if(offset < tableOffsetTop || offset > tableOffsetBottom) {
                  header.removeClass("fixed-header");
              } else if(offset >= tableOffsetTop && offset <= tableOffsetBottom && !header.hasClass("fixed")) {
                  header.addClass("fixed-header");
              }
          }

          resizeFixed();
          $(window).resize(resizeFixed);
          $(window).scroll(scrollFixed);
      }

/*sticky header*/
 .fixed-header {
        top:46px;
        position:fixed;
        width:auto;
        z-index: 100000;
      }

      .scrollMore {
        margin-top:600px;
      }

      .up {
        cursor:pointer;
      }
    @@media screen and (max-width: 1130px) {
        .fixed-header {
            top: 91px;
        }
    }
    @@media screen and (max-width: 766px) {
        .fixed-header {
            top: 0px;
        }
    }

CustomizeGrid（）添加/删除类，并在滚动和调整大小时更新偏移值。问题是剑道网格的结构受到干扰。如果单击刷新按钮，剑道会很好地进行自我调整。

现在的问题是，在对kendo的数据绑定调用时，Customize grid only功能仅起作用，而refresh（）再次触发数据绑定事件。因此，我无法在这些方法中添加刷新代码，因为它会创建一个循环。

我只想在此Customize方法完成操作后刷新（仅一次）网格。

Answer 1

在网格加载和窗口调整大小事件上运行此AdjustGrid()方法。根据页眉页脚的高度分配偏移量。

该小说将根据屏幕上的可用区域保持网格大小，以便在标题可见时进行滚动。

var offset=$("#header").height()+$("#footer").height();

function AdjustGrid() {
        $.each($(".k-grid-content > table:nth-child(1) > tbody:nth-child(2), .k-grid-content-locked > table:nth-child(1) > tbody:nth-child(2)"), function (i, item) {
            item.parentElement.parentElement.id = "adjustableGridContent";
            $('#adjustableGridContent').css("height", "auto");
            if ($('#adjustableGridContent').height() > ($(window).height() - offset))
                $('#adjustableGridContent').css("height", $(window).height() - (offset+30) + "px");
            /*you can add your custom code according to your design*/
 });
            item.parentElement.parentElement.id = "";
        });
    }

Kendo UI粘滞/固定/浮动标题破坏了整体结构

1 个答案: