get()/set()

[Don]

This is from your "Getting started" page:

<!-- View -->

<div id="view">

<!-- The value of the INPUT element is bound to the "firstName" field of the View-Model.

When the value changes so will the "firstName" field and vice versa. -->

<label>First Name:<input data-bind="value: firstName" /></label>

<!-- The value of the INPUT element is bound to the "lastName" field of the View-Model.

When the value changes so will the "lastName" field and vice versa. -->

<label>Last Name:<input data-bind="value: lastName" /></label>

<!-- The click event of the BUTTON element is bound to the "displayGreeting" method of the View-Model.

When the user clicks the button the "displayGreeting" method will be invoked. -->

<button data-bind="click: displayGreeting">Display Greeting</button>

</div>

<script>

// View-Model

var viewModel = {

firstName: "John",

lastName: "Doe",

displayGreeting: function() {

// Get the current values of "firstName" and "lastName"

var firstName = this.get("firstName");

var lastName = this.get("lastName");

 

alert("Hello, " + firstName + " " + lastName + "!!!");

}

};

// Bind the View to the View-Model

kendo.bind($("#view"), viewModel);

</script>

You can actually condense these lines:

// Get the current values of "firstName" and "lastName"

          var firstName = this.get("firstName");

          var lastName = this.get("lastName");

 

          alert("Hello, " + firstName + " " + lastName + "!!!");

into a single line which uses the properties directly instead of calling "get()" and assigning it to a local variable, first.  In other words, this works:

alert("Hello, " + this.firstName + " " + this.lastName + "!!!");

That makes a lot of sense because we should be able to directly use the local properties.  However, this does not work if you wanted to clear the input:

this.firstName = '';

You have to use this, instead:

this.set("firstName", '');

which seems strange.  So, my questions are:

1)  Is there a reason why you didn't directly use the properties (e.g. "this.firstName" instead of "var firstName = this.get('firstName');") in the demo?  Is there a downside to doing it that way?
2)  Is the fact that we can't "set" local properties directly (as we can "get" them) a bug/oversight?

Thanks.

[Michael]

My guess is because your entity gets converted/wrapped into the observable object, thus it is not the same object anymore. Accessing directly bypasses the observable pattern and is accessing stale or updating a stale version. Just a guess; I haven't looked at the underpinnings but it does not surprise me tho with this convention.

On another note, came across this as I am having a heck of a time actually getting and setting values, even WITH this convention. Everything seems stale and not triggering when updated. So stumped...

Mike