Kendo MVVM и привязка или расширение пользовательских событий

У меня есть ComboBox на моей странице, и я хочу связать событие нажатия клавиши с моим Kendo ComboBox, когда клиент записывает любую букву.

Насколько я понимаю, у кендо нет события нажатия клавиши в ComboBox.

Я обнаружил, что в кендо есть что-то вроде этого для привязки значений и функций:

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();
            }
        }
    });

Источник: Нажмите здесь

Но проблема в том, что я не могу обойти это и заставить его вызывать событие нажатия клавиши в InputBox в элементе управления KendoComboBox.

Помните, что я использую MVVM и не хочу использовать что-то вроде $('k-input').keypress(...); Я действительно хочу добавить что-то в свою структуру кендо, манипулируя методом расширения, который предоставил нам кендо.

Заранее спасибо.


mvvm custom-events kendo-ui
person Hirad Nikoo    schedule 27.01.2013    source источник

Ответы (2)


arrow_upward
13
arrow_downward

Это было сложнее, чем я думал, но вы можете справиться с этим, создав собственное связывание MVVM для присоединения к событию keyPress элемента input, например:

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 () {}
});

Вы бы привязали это к функции в модели представления.

<input data-role="combobox"
    data-text-field="text"
    data-value-field="value"
    data-bind="keyPress: onKeyPress, source: data"></input>


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

Вот рабочий jsFiddle.

person CodingWithSpike    schedule 27.01.2013
comment
Уважать! Спасибо, мужик ... хотя я пробовал что-то подобное, я не смог закончить. Но ты знаешь? Говорят, тот, кто закончил работу, заслуживает всех похвал. И я должен сказать, что я действительно ценю все время, которое вы потратили на этот вопрос. Большое спасибо! - person Hirad Nikoo; 28.01.2013
comment
@Sabox рад, что смог помочь. Для меня это тоже был опыт обучения. Я не понимал, что если вы создаете связыватель MVVM для не-виджетов, вы назначаете его kendo.data.binders.myBindersName, но для того, чтобы он работал с виджетами, такими как ComboBox, вместо этого вам нужно назначить свой связыватель kendo.data.binders.widget.myBindersName Эта маленькая деталь заняла некоторое время. выяснить! - person CodingWithSpike; 28.01.2013
comment
@CodingWithSpike, это круто, но я не могу заставить его работать с автозаполнением. Есть идеи? - person click2install; 02.02.2014
comment
Я разместил это как вопрос здесь: stackoverflow.com/questions/21508550/, поскольку я нашел другой подход, который выглядел многообещающе... для начала. - person click2install; 02.02.2014

arrow_upward
0
arrow_downward

Вы можете захватить событие нажатия клавиши всех элементов управления ComboBox, используя следующий код:

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

Это также работает с виджетом DropDownList, который обычно не поддерживает события нажатия клавиш.

person John Meyer    schedule 28.07.2015