HTML and CSS Reference
In-Depth Information
Esistono custom binding di diversi tipi per manipolare il DOM:
value
: imposta e legge la proprietà
value
dell'oggetto HTML;
text
e
html
: impostano la proprietà
innerText
e
innerHTML
dell'oggetto
HTML;
text
e
html
: impostano la proprietà
innerText
e
innerHTML
dell'oggetto
HTML;
visible
: imposta la visibilità di un oggetto HTML tramite la proprietà CSS
di-
splay
;
css
: imposta una classe CSS se il valore dell'observable collegato è true;
enable
e
disable
: impostano se il campo è editabile o no a seconda del valore
booleano dell'observable collegato.
Oltre a questi custom binding ce ne sono altri per gestire gli eventi degli oggetti, come
submit
,
click
ed
event
. Vediamo come usare
click
per i nostri scopi.
Supponiamo di voler aggiungere un bottone che mostra un messaggio con il nome
completo dell'utente e un saluto. Il primo passo consiste nell'aggiungere una funzione al
ViewModel che mostra il messaggio. Il secondo consiste nell'aggiungere un pulsante nel
codice HTML e, nel suo attributo
data-bind
, usare il custom binding
click
per invo-
care il metodo. Tutto questo viene mostrato
nell'esempio 11.15
.
Esempio 11.15
//JavasScript
function TestViewModel() {
...
this.sayHello = function() {
alert("ciao " + this.fullName());
};
}
//HTML
<button data-bind="”click: sayHello">Saluta</button>
