Question

I have started a jsFiddle to see if someone can kindly help me to fix a logic problem I have in my attempt to use cascanding selects with added captions. It is partially working

I have two selects and would like to add captions to advise the user what to do and expect. I have tried using ko.computed as Flo sugggested but my logic is still not right.

THIS IS THE LOGIC

select1 = Poster Select select2 = Client Select

一个邮局可以有许多客户。

1 - If the view model s POSTER ARRAY LIST is empty I add No Posters caption to select1. I also 增加上限2 不包括客户and disable both selects

2 - If the view model s POSTER ARRAY LIST has only one item I display the current item and no caption

         if the selected Poster object has no ClientSite array, I

增加上限2 不包括客户

         if the selected Poster object has only one item in the

ClientSite array, I display the current ClientSite item in select2 and disable the select2

         if the selected Poster object has a collection of

客户,我在选择2时展示选择性客户上限

3 - If the view model s POSTER LIST has many items, I display a caption in in select1 Select Poster

         if the selected Poster object has no ClientSite array, I

to 增加上限2 不包括客户

         if the selected Poster object has only one item in the

客户阵列,我展示该项目,可以选择2

         if the selected Poster object has more than one item in

the ClientSite array, I display Select Client in select2

When I select an item in select1 that has items in the ClientSite and then go back to the caption Select Poster , I get an error. I think the reason for this is that I am changing from an object to a string but select2 is expecting an object.

Please could someone share some light?

卡车

C

Answer 1

问题是,在选择1的“电子海报”价值时。选定的“Poster”观测站被确定为不明确。阁下的第二项选择中包含着依赖这种价值而不作任何界定的约束力,因此,错误。

一个简单固定点是利用一些计算变数保护第二个选择国家。

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>

这里是一个dle。

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

希望这一帮助。

THIS IS THE LOGIC

友情链接