如何在kendo中添加一个Button弹出

时间:2014-10-28 07:21:04

标签: button kendo-ui popup

![kendo popup] [1]

如何添加按钮以查看kendo弹出窗口UI中的详细信息 像更新,取消按钮。我想在弹出窗口中添加一个按钮

1 个答案:

答案 0 :(得分:0)

这是确认模式对话框的HTML

<div data-role="modalview" id="confirmationView" data-init="app.confirmationView.onInit" style="display: none;">
    <p class="message" data-bind="text: confirmationText"></p>
    <hr>
    <p>
        <a data-role="button" class="buttonYes" data-bind="click: onYesClick">Yes</a>
        <a data-role="button" class="buttonNo" data-bind="click: onNoClick">No</a>
    </p>
</div>

这就是它的ViewModel(一个requireJs模块)

/*global define*/
define(['kendo', 'jquery'], function (kendo, $) {
    'use strict';
    var viewModel = kendo.observable({
        callback: undefined,
        confirmationText: '',
        onInit: function () {
            kendo.bind('#confirmationView', viewModel);
        },
        onYesClick: function () {
            if (typeof viewModel.callback === 'function') {
                viewModel.closeConfirm();
                viewModel.callback(true);
            } else {
                viewModel.closeConfirm();
            }

        },
        onNoClick: function () {
            if (typeof viewModel.callback === 'function') {
                viewModel.callback(false);
            }
            viewModel.closeConfirm();
        },
        onCloseClick: function() {
            viewModel.closeConfirm();
        },
        showConfirm: function(text, callback) {
            viewModel.callback = callback;
            viewModel.set('confirmationText', text);
            $("#confirmationView").show().data().kendoMobileModalView.open();
        },
        closeConfirm: function () {
            $("#confirmationView").data().kendoMobileModalView.close();
        }
    });

    return viewModel;
});

要显示确认对话框,您只需从此模块中调用showConfirm

即可