k-textbox input in html create event template not reflecting value change in javascript (kendo scheduler)

Question

I have an html input that has the k-textbox class to make it a kendo styled input textbox:

<input id="LocationInput" class="k-input .k-textbox" data-bind="value:location"/>

Then, when I open the create event popup (which is where the location input text box is located) and I have a user specified parameter for LocationInput with a value they wish to autofill....

I do $('#'+paramData[i].fieldName+'Input').val(paramData[i].recordId);

where paramData is an array of passed parameters, fieldName would be 'Location' and recordId would be its value. After this, the text is set correctly in the console when checked with console.log, but no changes are reflected in the create event popup, the box is still empty. I tried adding a '.change()' after the '.val()' but that didn't do anything either.

How can I get the 'k-textbox' input to reflect the value I set it to in the javascript when the input is part of the create event template?

Answer 1

To find the input you should search within the container element of the event object that gets passed to your handler:

function yourSchedulerAddOrEditEventHandler(e) {
    e.container.find('#'+paramData[i].fieldName+'Input').val(paramData[i].recordId);
    e.container.find('#'+paramData[i].fieldName+'Input').trigger("change");
}

See here for more info http://docs.telerik.com/kendo-ui/api/javascript/ui/scheduler#events