I have this field in my kendo grid column :

field: "tauxAcquisEntree",
template: '#if (tauxAcquisEntree === 0){#'
                    + '<div class="text-right">#= tauxAcquisEntree #</div>'
                    + '# }else if (tauxAcquisEntree > 1 ){#'
                    + '<div class="d-flex justify-content-end"><div class="input-group d-flex flex-nowrap percent-input"> <input id="fraisent" name="fraisent" value="#= tauxAcquisEntree #" max="4"   class="form-control text-center"  min="1" type="number" step=1 pattern="[0-9]$" autocomplete="off"   /> </div></div>'
                    + '# }else{#'
                    + '<div id="fraisOne" name="fraisOne" class="d-flex justify-content-end"><div class="input-group d-flex flex-nowrap percent-input"> <input value="#= tauxAcquisEntree #" class="form-control text-center" max="1" min="1"  type ="number" pattern="[0-1]$" autocomplete="off" readonly  /> </div></div>'
                    + '# }#'
                ,

I have a condition when i get the field "tauxAcquisEntree" from the "database"  if it's equal to "1" the input type number becomes readonly.

The problem is when the user changes the value of the input type number in the front and it's equal to "1" the template condition gets triggered which is a behavior that i don't want to happen.

To summarize how can i get the if condition in the template to be applied only if the value if from backend or the database (and not what the user typed) ?

I'm using template binding to display a list of users.   For each user, we have a yes/no radio button and a drop down.  The options available in the drop down are dependent on the radio button.  If the user picks "yes" in the radio, we give them 4 options in the drop down, if they select no, we give them 2 options.

I created a view model that contains an array of users and for each user I have an array of the available options for the drop down. 

ex. viewModel= [{UserId: 1, RBValue: true, DropDownId: 3, DropDownOpts: [1,2,3,4]}, {UserId: 2, RBValue: false, DropDownId:1, DropDownOpts: [1,2]};

And then in my template I have a select  as such:

<select source: DropDownOpts, value: DropDownId"></select

When the radio is updated, I modify the DropDOwnOpts for that item.   

When the page loads, it works fine.   The appropriate options appear in the dropdown list, but when I modify the DropDownOpts in the viewmodel, I can see the update in the console, but the options do not change.

Am I missing something obvious here?  Or is this not possible (I'm sure I can do it via js, but would rather not).

Thanks for any help.

When using the MVVM value binding with the DropDownTree, pressing the X button to clear the selection does not clear the bound field in the viewmodel.  If the DropDownTree is configured with valuePrimitive=true, then the VM bound field is completely unchanged  If the DropDownTree is configured with valuePrimitive=false, then the VM bound field is set to the string value of the prior selection's ID.

So my present workaround is to use valuePrimitive=false and if the VM bound field ends up being a string instead of an object, then treat it as null instead.  This adds a bunch of extra and ugly code to my app - is there any way to get the widget to simply set the bound VM field to null when the user clicks the X?

I'm specifically working with the scheduler, however I believe this applies to any MVVM items.

When double click an event in the scheduler, my editor template is rendered and Kendo binds this to the event being edited. This happens for "free" as I do not do this. Consider this element:

<div data-container-for="title">
   <input type="text" data-role="textbox" name="title" required="required" data-bind="value:title" />
</div>

The binding to title works perfectly fine and I see my value.

Next, my event has a CategoryId which tags the event and what it is. This is a property I have added. Let me point out that if I replace title above with CategoryId, the integer value of the category displays. So this value is known and part of the bound object. However, I am using a very custom templated dropdown for this.

<div data-container-for="CategoryId">
   <input id="CategoryId" data-bind="value: CategoryId, source: categoriesDataSource" data-role="dropdownlist" data-auto-width="true"
          data-header-template="categorySearchHeaderTemplate" data-template="categorySearchTemplate" data-text-field="Description"
          data-value-field="Id" data-auto-bind="false" />
</div>

Hopefully this makes sense. My categories have an Id and a Description. There is a list of them. The event has a CategoryId which holds the value of what category is selected. However this element has its own datasource! Note the data-bind.

// This datasource is created and then kendo.bind() is called to bind to my dropdown
var categoriesViewModel = kendo.observable({
   categoriesDataSource: new kendo.data.DataSource({
      data: jsonSerializedCategories
   })
});

This drop down works perfectly fine for templates and for the elements in it. See screenshot below. But the value binding does not work. This is obviously because I had to set my own datasource on it. The value is not found in that datasource; it's in the one Kendo generated and applied to the popup. What is the proper way to set this up? The value is in one datasource and the elements here are in the other one I created.