height - KO 网格滚动条不可见和显示问题

Question

我在使用 KOgrid 时遇到两个问题。

1)我无法在kogrid中获取滚动条。没有滚动条很难进行数据输入。

2)如果不指定硬编码的高度和宽度，我也无法让 kogrid 工作。在我的应用程序中，我不能有固定的高度和宽度。 还有其他人有同样的问题吗？

我尝试了此线程中的解决方法建议(使用 jQuery 修复作为我的 View 模型中的最后一行)。 KO Grid Display Isseues, On resize Gird shows one row. Images also included

这只是增加了网格的大小，但没有显示任何数据。但是，当我调整页面大小时，会显示页面数据。

下面是我的 HTML 和 kogrid 选项(我尝试过使用和不使用分页选项，理想情况下我不想使用分页)

 <div data-bind="koGrid: gridOptions" 
    style="height: 800px; background-color: none;width: 1850px;">
  </div>


  self.gridOptions = {
        data: self.mydatarray,
        footerVisible: true,
        displaySelectionCheckbox: true,
        afterSelectionChange: self.RowSelectionChange,
        rowHeight: 50,
        selectWithCheckboxOnly: true,
        enableSorting: false,
        multiSelect: true,
        selectedItems: self.SelectedRows,
        enableColumnResize: true,
        showFilter: false,
        canSelectRows: true,
        enablePaging: true,
        pagingOptions: {
            currentPage: ko.observable(1), 
            pageSize: ko.observable(3),
            pageSizes: ko.observableArray([3, 6, 9])

        },
        rowTemplate: errrowtmpl,
        columnDefs: [
            { field: 'Customer', displayName: 'Customer', cellTemplate: Customersddedittmpl, headerCellTemplate: headercelltmpl },
              ...
      ...

            { field: 'GenNotes', displayName: 'GenNotes', cellTemplate: simpleedittmpl, headerCellTemplate: headercelltmpl }
        ]

    }

如果您需要更多信息，请告诉我

谢谢

肯纳开发

Answer 1

我找到了解决我面临的问题的方法。

1)我使用Jquery添加滚动条。我在下面添加了代码行作为数据加载函数的最后一行。我不确定这会破坏任何其他 KOGrid 功能。在我的应用程序中，我做了一些基本测试，它似乎工作正常。

    $("div.kgViewport").css("overflow", "scroll"); 

2)我仍然不知道如何100%解决这个问题。除非样式中提到固定的宽度和高度，否则它仍然不起作用。在我的应用程序中，我使用 vw 和 vh 而不是固定宽度和高度来解决使其在所有屏幕尺寸上工作的问题。

  <div data-bind="koGrid: gridOptions" 
    style="height: 73vh;overflow:scroll;width: 96vw;"></div>