Dealing with duplicate fields?

[Ryan Leach]

What would be the best way to model having duplicate fields hidden by a checkbox?

e.g. 

Text: Shipping Address Part 1:

Text: Shipping Address Part 2:

Text: Billing Address Part 1:

Text: Billing Address Part 2:

CheckBox: Billing Address Differs from Shipping Address.

The address editing panel is set up as a separate VM, as is the customer that it binds to.

e.g.

AddressPanel

  cust = observable(new customer())
  shippingAddress1 = computed( delegates to customer shipping)

  shippingAddress2 = observable( delegates to customer shipping )

  billingAddress1 = computed(!alternateAddress ? cust.shippingAddress : cust.billingAddress)

  billingAddress2 = computed(!alternateAddress ? cust.shippingAddress2 : cust.billingAddress2)
  alternateAddress = observable(false)

But the problem is, updating the alternate/address when the customer changes externally / page load, editing the fields (when to sync or not) 

The end result should be that if alternate is not ticked, then billing has the same value as shipping.

Do I want to push the writes out from the observable and update others, or pull them from the read somehow?

I think alternate Address itself should be a computed, but then how do I tell the difference between human input telling the address to show, (and breaking the sync, (or should it even break?)) vs the selected customer changing?

(I'm imagining that changing the selected customer should reset the state to how the page loads.)

In reality I have about 4-6 fields that all correspond off this checkbox, and I'm constantly chasing bugs to do with the alternate data either getting stuck, not replicating, or starting in an invalid state.

Cheers,
Ryan Leach

[Michael Best]

I would make the address fields plain observables and make "alternateAddress" a writable computed.

Its read function would compare the shipping and billing address values and return true/false if they match/don't match.

Its write function would copy the shipping address to the billing address if a true value is given or clear the billing address if a false value is given.

-- Michael

[Ryan Leach]

Unfortunately this is a simplified example, and the addresses are made up of multiple parts that also get set programmatically. 

The real world example has a dataType dataTypeDesc dataId dataIdDesc dataPrefix dataUserDefined, as well as all of these again for the 'fill'

The annoying part is that the descriptions, whether they can have prefixes, and whether they can be user defined all vary based on the datatype. 
the data type id is usually composed by prefix+UserDefined+id and that's probably even missing a second prefix.

Will using computed's for all of them work? might need to use a combination of private observables and public observables.

--
You received this message because you are subscribed to the Google Groups "KnockoutJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to knockoutjs+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Michael Best]

I just realized I had the logic for "alternateAddress" backwards. I was thinking of it as "sameAddresss".