I tried what I thought was a pretty basic use of the observables: binding a numeric text box to a value, and then using that value in the datasource. However, it does not work. I'm wondering if what I'm trying to do is possible and I'm just doing it wrong, or if what I'm trying to do isn't possible. Here's a dojo, and the code is below as well.
<div id=
"example"
>
<div class=
"demo-section k-content wide"
>
<div class=
"box"
>
<input id=
"Value1NumericTextBox"
data-role=
"numerictextbox"
data-format=
"c0"
data-decimals=
"0"
data-bind=
"value: Value1, events: { change: ValueChange }"
data-min=
"0"
/>
<input id=
"Value2NumericTextBox"
data-role=
"numerictextbox"
data-format=
"c0"
data-decimals=
"0"
data-bind=
"value: Value2, events: { change: ValueChange }"
data-min=
"0"
/>
</div>
<div>
<div id=
"chart1"
data-role=
"chart"
data-series-defaults=
"{ type: 'line' }"
data-series=
"[ {field: 'amount'} ]"
data-bind=
"source: values"
style=
"height: 200px;"
></div>
</div>
</div>
<script>
(
function
() {
var
viewModel = kendo.observable({
Value1: 10,
Value2: 20,
ValueChange:
function
(e) {
var
chart = $(
"#chart1"
).kendoChart();
chart.refresh();
},
values:
new
kendo.data.DataSource({
data: [
{ amount:
function
() {
return
this
.get(
"Value1"
); } },
{ amount:
function
() {
return
this
.get(
"Value2"
); } }
]
})
});
kendo.bind($(
"#example"
), viewModel);
})();
</script>
</div>