Kendo MVVM and binding or extending custom events

匿名 (未验证) 提交于 2019-12-03 01:06:02

问题:

I have a ComboBox in my page and I want to bind keypress event to my Kendo ComboBox when the cliend writes down any letter.

As I understand kendo doesn't have any keypress event on ComboBox.

I've found that kendo has something like this to bind values and functions:

kendo.data.binders.slide = kendo.data.Binder.extend({         refresh: function () {             var value = this.bindings["slide"].get();              if (value) {                 $(this.element).slideDown();             } else {                 $(this.element).slideUp();             }         }     });

Source: Click Here

But the problem is I can't workaround that and make it to trigger keypress event on the InputBox in the KendoComboBox control.

Remember that I'm using MVVM and I don't want to use somthing like $('k-input').keypress(...); I want to actually add something in my kendo framework by manipulating the extend method that kendo provided for us.

Thank you in advance.

回答1:

This one was more complicated than I thought it would be, but you can handle this by making a custom MVVM binder to attach to the keyPress event of the input element, like this:

kendo.data.binders.widget.keyPress = kendo.data.Binder.extend({     init: function (element, bindings, options) {         kendo.data.Binder.fn.init.call(this, element, bindings, options);         var binding = this.bindings.keyPress;         $(element.input).bind("keypress", function(){binding.get();});     },     refresh: function () {} });

You would bind that to a function on the view model.

   var viewModel = kendo.observable({     data: [         {text: "One", value: 1},         {text: "Two", value: 2}     ],     onKeyPress: function () {         $("#output").append("
keyPress
"); } });

Here is a working jsFiddle.



回答2:

You can capture the keydown event of all ComboBox controls using the following code:

kendo.ui.ComboBox.fn._keydown = function(e) {     if (e.which == 13) {         alert("key pressed!");     } };

This also works with the DropDownList widget that generally doesn't support the keypress events.



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!