This is a migrated thread and some comments may be shown as answers.

data-value-update attribute on Kendo Masked Textbox

3 Answers 635 Views

MVVM

This is a migrated thread and some comments may be shown as answers.

Stephen asked on 26 Nov 2014, 11:24 PM

Hi,

I'm using v2014.2.716 and I'm having an issue with the data-value-update attribute when used on anything other than a plain, un-kendo'd <input>.

Example
Given this markup:

<div id="routes">

<input id="route-value" data-role="maskedtextbox" data-value-update="keyup" data-bind="value:route" />

<h3 data-bind="html: route"></h3>

</div>

and this script:

<script>

var model = kendo.observable({

route: "Initial value"

});

$(document).ready(function () {

kendo.bind($("#routes"), model);

});

</script>

I would have expected that as one types in the textbox, the <h3> element would update as each character is typed in the textbox.

However, this *only* works if I remove the data-role="maskedtextbox" from the <input> element...is data-value-update not actually supported for Kendo widgets? If not, then how can I style this plain input to look just like a kendo masked textbox? I don't need the masking behaviour, but it will stick out like a sore thumb on my form if it's not a kendo widget!

Many thanks,

Stephen

3 Answers, 1 is accepted

answered on 28 Jan 2016, 11:23 AM

Hello Kiril Nikolov

I using Kendo UI v2014.3.1411, I bind data to div using MVVM (my input id="txtNameQuestionGroup" is inside that div) . Example:

Javascript

kendo.bind($('#pop-add-questiongroup'), questionGroupViewModel);

Html

<input class="modal-input txtInput w-100per" maxlength="100" name="QuestionGroupName" id="txtNameQuestionGroup" tabindex="1" data-bind="value: group.Name" data-value-update="keyup" onkeyup="somefunction()" onpaste="somefunction()" />

Everything works fine. But if user click the input -> press arrow (up or down), browser shows autocomplete value -> user click 1 value -> Input will display that value but that value don't update to questionGroupViewModel.

I investigate and I understand that, viewmodel & input only update data when user press any button on keyboard, it' won't update viewmodel when user click mouse button.

Can you suggest some solution to update viewmodel when input value changing ?

Regards,
Cloud