Advanced usage: array of select tags controlled by textarea

DNS records

This is how DNS records are configured at LwS: a customer may have some domain names registered with LwS, and others registered elsewhere.

textarea

The textarea for "external" domains registered by the user with another service

is produced by the following code:

html

<textarea maxlength="100"
placeholder="list of external domain names"
db="value:extDomNames"></textarea>

← it is connected with the (observable) variable extDomNames (press F12 to see the code).

User input to the textarea is automatically corrected.

Dynamically updated table

(Press F12 to see the code.)

The following information is provided by the server:

the customer has registered domain name chalaev.com with LwS, but does not use it.
he uses 2 domain names for his website: customer-domain.com and another.domain.net (both registered elsewhere).

The table controls DNS records for the domain names specified by the user. It is dynamically updated both by its direct updates and by the updates of the text area:

optional prefix	domain name*	active
.

select options

Every line of the table contains select tag with the same set of options provided by the DNselectOptions variable:

var DNselectOptions=new DB.observable([extDomNames],{type:'oarray',
compute:()=>leanWebDNs.concat(extDomNames().split(' '))
.map(function(x){return {secLevDN:x}})});

← The variable DNselectOptions is declared to be dependent on extDomNames, so it is re-calculated every time the user updates the textarea.

More details

Examine the table behavior by updating the table and the text area.

Press F12 to see the code.