1

jsFiddle を開始して、キャプションが追加されたカスカンディング選択を使用しようとしているロジックの問題を解決するために誰かが親切に助けてくれるかどうかを確認しました。部分的に稼働しています

http://jsfiddle.net/cleytonjordan/4cDdD/4/

2 つの選択肢があり、キャプションを追加して、ユーザーに何をすべきか、何を期待すべきかをアドバイスしたいと考えています。Flo が提案したように ko.computed を使用してみましたが、私の論理はまだ正しくありません。

これがロジックです

select1 = ポスターの選択 select2 = クライアントの選択

1 つのポスターに多くのクライアントを含めることができます。

1 - ビュー モデルの POSTER ARRAY LIST が空の場合、select1 に「No Posters」キャプションを追加します。また、select2 'No Clients' にキャプションを追加し、両方の選択を無効にします

2 - ビュー モデルの POSTER ARRAY LIST に項目が 1 つしかない場合、現在の項目を表示し、キャプションは表示しません

         if the selected Poster object has no ClientSite array, I

select2 'No Clients' にキャプションを追加

         if the selected Poster object has only one item in the

ClientSite 配列、現在の ClientSite アイテムを select2 に表示し、select2 を無効にします

         if the selected Poster object has a collection of

ClientSites、select2 に「Select Client」キャプションを表示します

3 - ビュー モデルの POSTER LIST に多くのアイテムがある場合、select1 'Select Poster' にキャプションを表示します

         if the selected Poster object has no ClientSite array, I

select2 'No Clients' にキャプションを追加するには

         if the selected Poster object has only one item in the

ClientSite 配列、アイテムを表示し、select2 を無効にします

         if the selected Poster object has more than one item in

ClientSite 配列、select2 に「クライアントの選択」を表示します

ClientSite にアイテムがある select1 のアイテムを選択し、キャプション「Select Poster」に戻ると、エラーが発生します。この理由は、オブジェクトから文字列に変更しているためだと思いますが、select2 はオブジェクトを期待しています。

誰か光を分けてくれませんか？

乾杯

ハ

4

1 に答える 1

0

問題は、select1 で「Select Poster」の値を選択した場合です。selectedPoster observable は undefined に設定されます。2番目の選択には、この値がnull/未定義ではないことに依存するバインディングが含まれているため、エラーが発生します。

簡単な修正は、いくつかの計算された変数を使用して、この状態から 2 番目の選択を保護することです。

self.ClientOptions = ko.computed(function() {
    if (self.selectedPoster()) {
        return self.selectedPoster().ClientSite();
    }
    return [];
});

self.ClientOptionsDisabled = ko.computed(function() {
   if (self.selectedPoster()) {
      return !(self.selectedPoster().ClientSite());
   }
   return false;
});

マークアップの変更

<select id="Select2" data-bind="options: ClientOptions, optionsText: 'ClientName'
, optionsCaption:select2OptionsCaption(), value: selectedClient, 
disable: ClientOptionsDisabled"></select>

これがフィドルです。

http://jsfiddle.net/madcapnmckay/sDt4r/

お役に立てれば。

于 2012-04-13T17:47:09.333 に答える