How to change the value of a kendo bound html input

Question

I have a kendoui grid with a custom popup for editing.

In this popup I have an input which is bound to a value of the grid:

<input type="text" class="k-input k-textbox" id="test" data-bind="value:SearchFilter">

This works fine. Click edit in the grid, change the value in the textbox and the value propagates to the grid.

But now I want to change the value of the textbox in javascript.. So I now have this:

$('#test').val("testvalue");

This indeed changes the value of the textbox, but upon save the new value isn't propagated to the grid. I guess because no change event occurs on the textbox.

How do I make this work?

Answer 1

You need simulate change event. Try this code:

$('#test').val("testvalue").change();

Answer 2

I tried the above answer but did not work for me. Although the value had indeed changed, the view did not reflect that fact. This worked for me:

       var myvar = $("#myid").data("kendoNumericTextBox");
       myvar.value("newValue");
       myvar.trigger("change", { value: myvar.value() });