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

data-value-update attribute on Kendo Masked Textbox

3 Answers 573 Views
MVVM
This is a migrated thread and some comments may be shown as answers.
Stephen
Top achievements
Rank 1
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

Sort by
0
Kiril Nikolov
Telerik team
answered on 28 Nov 2014, 10:10 AM
Hello Stephen,

The data-value-update attribute will only work for plain input elements and not for widgets. Currently there is no workaround that can be offered in order to use this functionality for the NumericTextBox widget.

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
sc
Top achievements
Rank 1
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

0
Kiril Nikolov
Telerik team
answered on 01 Feb 2016, 08:09 AM

Hello sc,

 

It will update when the widget is blured. Would it be possible to open a new support thread where a runnable example is present, so we can look at?

 

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
MVVM
Asked by
Stephen
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
sc
Top achievements
Rank 1
Share this question
or