Issue 1: Here are two check boxes. If mouse toggles one of them so that both of them are checked (or unchecked), succeeding toggles by program will not be reflected any more by Firefox and Chromium.
What is the reason that makes browsers behave this way?
Issue 2: Value of committedValue in <core-input> never changes by mouse clicks while value of checked does, as shown by console.log. Maybe committedValue should use property checked instead of value when type is checkbox. No?
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<script src="webcomponents.min.js"></script>
<link rel="import" href="core-input/core-input.html">
</head>
<body>
<template id="i" is="auto-binding" repeat="{{c in inputs}}">
<input is="core-input" type="checkbox" value="{{c}}" checked?="{{c}}" on-change="{{change}}">
</template>
<button onClick="toggle();">Toggle</button>
<script>
var i = document.querySelector('#i');
i.inputs = [true,false];
function toggle(){
i.inputs[0]=!i.inputs[0];
i.inputs[1]=!i.inputs[1];
}
i.change = function(e){
console.log(e.target.value+","+e.target.committedValue+","+e.target.checked);
}
</script>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire