jquery - Slick Grid が毎回読み込まれない

Question

**修理済み。問題は列にありました。列をグリッドに表示し、列ピッカーのすべての可能な列を取得するために ajax 呼び出しを行っています。jQuery がコード ビハインドのように機能しないことを忘れていたので、関数 LoadColumns(); がありました。そして LoadAllColumns();。LoadAllColumns で ajax 呼び出しを行った後、グリッドをロードしていました。LoadColumns が最初に実行され、すべてがうまくいくこともあれば、うまくいかないこともあります。LoadColumns での ajax 呼び出しが成功した後に LoadAllColumns 関数を移動したところ、すべてがうまく機能するようになりました。助けてくれてありがとう！

Slick Grid を Web アプリケーションに実装していて、問題が発生しました。私は別のアプリケーションでグリッドを開発していましたが、すべてうまくいきました。次に、グリッドとすべてのコードを Web アプリケーションに移動しましたが、グリッドは毎回読み込まれません。グリッドに来てすべてが正常に読み込まれることもあれば、グリッドに行っても何も表示されないこともあります。私はデータビューを使用しており、ajax を介してデータを取得しています。最初にすべてのデータを取得してから、グリッドとデータ ビューをインスタンス化しています。私は一日中自分のコードを調べてきましたが、何が原因なのか困惑しています。

1. ajax呼び出しを実行しています（すべてのデータが正常に返されます）

2. 以下は、グリッドをロードする方法です

   function LoadGrid() {
     dataView = new Slick.Data.DataView({ inlineFilters: true });
     grid = new Slick.Grid("#grid", dataView, columns, options);
     grid.setSelectionModel(new Slick.RowSelectionModel());
     var pager = new Slick.Controls.Pager(dataView, grid, $("#pager"));
     var columnpicker = new Slick.Controls.ColumnPicker(allColumns, grid, options);
   
     //for sorting of the columns
     grid.onSort.subscribe(function (e, args) {
       sortdir = args.sortAsc ? 1 : -1;
       sortcol = args.sortCol.field;
       dataView.sort(comparer, args.sortAsc);
     });
   
   
     // if using the paging option, this is used to page through the rows
     dataView.onPagingInfoChanged.subscribe(function (e, pagingInfo) {
       var isLastPage = pagingInfo.pageNum == pagingInfo.totalPages - 1;
       var options = grid.getOptions();
       var enableAddRow = false;
       grid.setOptions({ enableAddRow: enableAddRow });
   
     });
   
   
     InitializeDataView();
     loadingIndicator.hide();
   }
   
   
   function InitializeDataView() {
     UpdateGrid();
   
     // if you don't want the items that are not visible (due to being filtered out
     // or being on a different page) to stay selected, pass 'false' to the second arg
     dataView.syncGridSelection(grid, true);
   
     // wire up model events to drive the grid
     dataView.onRowCountChanged.subscribe(function (e, args) {
       grid.updateRowCount();
       grid.render();
     });
   
     dataView.onRowsChanged.subscribe(function (e, args) {
       grid.invalidateRows(args.rows);
       grid.render();
     });
   
   
     //                if using the paging option, this is used to page through the rows
     dataView.onPagingInfoChanged.subscribe(function (e, pagingInfo) {
       var isLastPage = pagingInfo.pageNum == pagingInfo.totalPages - 1;
       var enableAddRow = isLastPage || pagingInfo.pageSize == 0;
       var options = grid.getOptions();
   
       if (options.enableAddRow != enableAddRow) {
           grid.setOptions({ enableAddRow: enableAddRow });
       }
     });
   }
   
   
   function UpdateGrid() {
     // initialize the model after all the events have been hooked up
     dataView.beginUpdate();
     dataView.setItems(data);
     dataView.setFilterArgs({
       searchString: searchString
     });
     dataView.setFilter(myFilter);
     dataView.endUpdate();
     loadingIndicator.hide();
   }
   

グリッドが戻ってきますが、データはロードされません。また、正しい行数は 312 である必要があります。以下は、グリッドがインスタンス化された後の html です。

     <div class="slick-viewport" style="width: 100%; overflow: auto; outline: 0px; position: relative;
        height: 797px;">
        <div class="grid-canvas" style="width: 0px; height: 7800px;">
            <div class="ui-widget-content slick-row  odd" row="5" style="top: 125px">
            </div>
            <div class="ui-widget-content slick-row  even" row="6" style="top: 150px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="7" style="top: 175px">
            </div>
            <div class="ui-widget-content slick-row  even" row="8" style="top: 200px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="9" style="top: 225px">
            </div>
            <div class="ui-widget-content slick-row  even" row="10" style="top: 250px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="11" style="top: 275px">
            </div>
            <div class="ui-widget-content slick-row  even" row="12" style="top: 300px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="13" style="top: 325px">
            </div>
            <div class="ui-widget-content slick-row  even" row="14" style="top: 350px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="15" style="top: 375px">
            </div>
            <div class="ui-widget-content slick-row  even" row="16" style="top: 400px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="17" style="top: 425px">
            </div>
            <div class="ui-widget-content slick-row  even" row="18" style="top: 450px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="19" style="top: 475px">
            </div>
            <div class="ui-widget-content slick-row  even" row="20" style="top: 500px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="21" style="top: 525px">
            </div>
            <div class="ui-widget-content slick-row  even" row="22" style="top: 550px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="23" style="top: 575px">
            </div>
            <div class="ui-widget-content slick-row  even" row="24" style="top: 600px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="25" style="top: 625px">
            </div>
            <div class="ui-widget-content slick-row  even" row="26" style="top: 650px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="27" style="top: 675px">
            </div>
            <div class="ui-widget-content slick-row  even" row="28" style="top: 700px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="29" style="top: 725px">
            </div>
            <div class="ui-widget-content slick-row  even" row="30" style="top: 750px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="31" style="top: 775px">
            </div>
            <div class="ui-widget-content slick-row  even" row="32" style="top: 800px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="33" style="top: 825px">
            </div>
            <div class="ui-widget-content slick-row  even" row="34" style="top: 850px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="35" style="top: 875px">
            </div>
            <div class="ui-widget-content slick-row  even" row="36" style="top: 900px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="37" style="top: 925px">
            </div>
            <div class="ui-widget-content slick-row  even" row="38" style="top: 950px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="39" style="top: 975px">
            </div>
            <div class="ui-widget-content slick-row  even" row="40" style="top: 1000px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="41" style="top: 1025px">
            </div>
            <div class="ui-widget-content slick-row  even" row="42" style="top: 1050px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="43" style="top: 1075px">
            </div>
            <div class="ui-widget-content slick-row  even" row="44" style="top: 1100px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="45" style="top: 1125px">
            </div>
            <div class="ui-widget-content slick-row  even" row="46" style="top: 1150px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="47" style="top: 1175px">
            </div>
            <div class="ui-widget-content slick-row  even" row="48" style="top: 1200px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="49" style="top: 1225px">
            </div>
            <div class="ui-widget-content slick-row  even" row="50" style="top: 1250px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="51" style="top: 1275px">
            </div>
            <div class="ui-widget-content slick-row  even" row="52" style="top: 1300px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="53" style="top: 1325px">
            </div>
            <div class="ui-widget-content slick-row  even" row="54" style="top: 1350px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="55" style="top: 1375px">
            </div>
            <div class="ui-widget-content slick-row  even" row="56" style="top: 1400px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="57" style="top: 1425px">
            </div>
            <div class="ui-widget-content slick-row  even" row="58" style="top: 1450px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="59" style="top: 1475px">
            </div>
            <div class="ui-widget-content slick-row  even" row="60" style="top: 1500px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="61" style="top: 1525px">
            </div>
            <div class="ui-widget-content slick-row  even" row="62" style="top: 1550px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="63" style="top: 1575px">
            </div>
            <div class="ui-widget-content slick-row  even" row="64" style="top: 1600px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="65" style="top: 1625px">
            </div>
            <div class="ui-widget-content slick-row  even" row="66" style="top: 1650px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="67" style="top: 1675px">
            </div>
            <div class="ui-widget-content slick-row  even" row="68" style="top: 1700px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="69" style="top: 1725px">
            </div>
            <div class="ui-widget-content slick-row  even" row="70" style="top: 1750px">
            </div>
            <div class="ui-widget-content slick-row  odd" row="71" style="top: 1775px">
            </div>
            <div class="ui-widget-content slick-row  even" row="72" style="top: 1800px">
            </div>
        </div>
    </div>