KO Grid滚动条不可见和显示问题

Question

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

1) 我无法在kogrid中获得滚动条。没有滚动条非常难以进行数据输入。

2) 我也无法在没有指定硬编码高度和宽度的情况下让kogrid工作。在我的应用程序中，我不能有固定的高度和宽度。是否有其他人遇到过同样的问题？

我尝试了这个线程中的一个解决方法（在我的viewmodel中最后一行使用jQuery fix）。 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 }
        ]

    }

如果您需要更多信息，请告知我。谢谢，Kenner Dev。

- Kenner Dev

Answer 1

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

1）我使用了Jquery来添加滚动条。我在我的数据加载函数的最后一行添加了下面的代码。我不确定是否会破坏其他KOGrid功能。在我的应用程序中，我进行了一些基本测试，看起来运行良好。

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

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

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

- Kenner Dev