1

検索機能用に 2 つのビュー モデルがあります。最初のビュー モデルには、2 つのオブザーバブル、検索文字列、および検索タイプが含まれています。2 番目のビュー モデルは、検索に基づく結果です。私の Ajax 投稿では、検索タイプと検索文字列を変数として使用して、目的の結果を取得しています。しかし、次のエラーが表示されます* Uncaught Error: Unable to parse bindings. メッセージ: ReferenceError: 顧客が定義されていません。バインディング値: foreach: Customers* customers 配列が初期化されていないため、検索ボタンのクリックに基づいて 2 番目のビュー モデルのバインディングを適用します。これは、私がやろうとしていることをよりよく説明するためのフィドルです。

ここに私の完全なJavaScriptコードセグメントがあります:

  var CustomerSearchViewModel = {
        SearchType: ko.observable(""),
        SearchString: ko.observable(""),
        setSearchType: function (data, element) {
            this.SearchType($(element.target).val());
        }
    }

    var CustomerSearhResultViewModelDS = function (data) {
        var self = this;
        self.CustomerID = ko.observable(data.CustomerID);
        alert(self.CustomerID);
        self.CustomerName = ko.observable(data.CustomerName);
        self.CustomerEMail = ko.observable(data.CustomerEMail);
        self.CustomerTelephone = ko.observable(data.CustomerTelephone);
        self.CustomerCompanyName = ko.observable(data.CustomerCompanyName);
        self.CustomerCompanyAddress1 = ko.observable(data.CustomerCompanyAddress1);
        self.CustomerCompanyAddress2 = ko.observable(data.CustomerCompanyAddress2);
        self.CustomerCompanyZipCode = ko.observable(data.CustomerCompanyZipCode);
    }


    var CustomerSearhResultViewModel = function (Customer) {
        var self = this;

        self.Customers = ko.observableArray(Customer);

        $.ajax({
            url: "/Services/DataServicesECOM.svc/CustomerSearch",
            data: { SearchType: CustomerSearchViewModel.SearchType(), SearchString: CustomerSearchViewModel.SearchString() },
            type: "GET",
            contentType: "application/json; charset=utf-8",
            dataType: "JSON",
            timeout: 10000,
            success: function (Result) {
                var MappedCustomer =
              $.map(Result.d,
             function (item) {
                 return new CustomerSearhResultViewModelDS(item);
             }
               );
             self.Customers(MappedCustomer);
                $('#ModalDetail').modal('show');
            },
            error: function (xhr, status) {
                alert(status + " - " + xhr.responseText);
            }
        });
    };

    function ActivateSearch() {
        var VM = new CustomerSearhResultViewModel();
        ko.applyBindings(VM);
    }

    $(document).ready(function () {
        ko.applyBindings(CustomerSearchViewModel);
    });
4

1 に答える 1

1

まず、各ビュー モデルをページのさまざまな部分にバインドする必要があります。その方法については、 knockout.js を使用して部分ビューをレンダリングするを参照してください。

次に、ページの読み込み時に空の検索結果ビュー モデルを初期化し、それを必要なページ セクションにバインドし、結果が得られたらそのビュー モデルを更新する必要があります。

余談ですが、ビュー モデルがデータ モデルとまったく同じプロパティを持っている場合、データを手動でコピーするのではなく、ノックアウト マッピング プラグインを使用します。

于 2013-02-12T09:28:03.877 に答える