0

ノックアウトでビューが適切に更新されないという問題が発生しています... ビュー データを取得するために ajax 呼び出しを行い、ノックアウトを使用してレンダリングします。後続のリクエストでは、ビュー データを取得するために ajax 呼び出しを行い、ページを新しいもので更新します。

問題は、オンコール 2、3、4 などです... ページが新しいデータで更新されていません。問題の可能性があるマッピング プラグインを使用しています。

if (filterLogModel == null) {
    filterLogModel = ko.mapping.fromJS(data);
    ko.applyBindings(filterLogModel, document.getElementById("dvFilterLog"));
} else {
    ko.mapping.fromJS(data, filterLogModel);
}

これは正しいパターンだと思いましたが、そうではないでしょうか?

私がすでに確認したこと: 1 - 入ってくる新しいデータが異なること 2 - デバッガーを実行し、最初の要求が IF ブロックを通過し、後続の要求が ELSE ブロックを通過すること。

返されたデータに HTML のデータ部分が含まれていない場合、条件があります

<div id="filterLogResults">
<!-- ko if: $data.length <= 0 -->
    <p class="attention">There are no errors for this task.</p>
<!-- /ko -->
<!-- ko if: $data.length > 0 -->
    <table class="tbl">
        <thead>
            <tr>
                <th>Description</th>
                <th>Value 1</th>
                <th>Operator</th>
                <th>Value 2</th>
                <th>Corrective Action</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: $data">
            <tr>
                <td class="nowrap" data-bind="text:Description"></td>
                <td class="nowrap" data-bind="text:Value1"></td>
                <td class="nowrap" data-bind="text:OperatorName"></td>
                <td class="nowrap" data-bind="text:Value2"></td>
                <td class="main" data-bind="text:CorrectiveAction"></td>
            </tr>
        </tbody>
    </table>
<!-- /ko -->
</div>

ビューが更新され、結果がないことがわかります...しかし、データがある場合、新しいデータではなく、キャッシュされたビューまたは何かを表示しているようです。

もう一つ気になった点。最初のリクエストにデータが含まれている場合。2 番目の要求にはデータが含まれていません。3 番目の要求には、いくつかのデータが含まれています。- この場合、3 番目のリクエストは、最初のリクエストのデータではなく、新しいデータを表示します。ビューが更新されないデータを持つ 2 つのリクエストが連続している場合にのみ発生するようです。

これを修正する方法についてのアイデアはありますか?

編集：フルJS

function getFilterLogs(suppressErrors, callback) {
    $("#filterLogResults").hide();
    if (!g_objCommon.isBoolean(suppressErrors)) {
        suppressErrors = false;
    }
    if (filterLogAjaxRequest != null) {
        filterLogAjaxRequestAborted = true;
        filterLogAjaxRequest.abort();
    }
    g_objCommon.showLoading();
    filterLogAjaxRequest = $.ajax({
        cache: false,
        type: "GET",
        url: absoluteRootPath + "api/Tasks/GetFilterLogs?id=" + g_nWorklistId,
        contentType: "application/json",
        success: function (data) {
            filterLogAjaxRequest = null;
            g_objCommon.hideLoading();
            if (filterLogModel == null) {
                filterLogModel = ko.mapping.fromJS(data);
                ko.applyBindings(filterLogModel, document.getElementById("dvFilterLog"));
            } else {
                ko.mapping.fromJS(data, {}, filterLogModel);
            }
            if ($.isFunction(callback)) {
                callback(data.length);
            }
            $("#filterLogResults").show();
            $("#filterLogResults .tbl").show();
        },
        error: function () {
            filterLogAjaxRequest = null;
            g_objCommon.hideLoading();
            if (!filterLogAjaxRequestAborted) {
                if (!suppressErrors) {
                    g_objCommon.showErrorModal("There was an error loading the errors.", undefined);
                }
                if ($.isFunction(callback)) {
                    callback(0);
                }
                $("#filterLogResults .attention").show();
                $("#filterLogResults .tbl").hide();
                $("#filterLogResults").show();
            }
            filterLogAjaxRequestAborted = false;
        }
    });
}
4

1 に答える 1