Question

我有多个按钮绑定点击事件：

<button type="button" class="btn btn-primary pull-right"
    data-bind="click: clickAction.bind($data, 'start')">Start
</button>

clickAction执行一些ajax查询，具体取决于给定的参数（“start”）。现在我想在加载请求时禁用此按钮... 我怎样才能访问这个属性：

// pseudo code
function clickAction(actionType) {
    $(senderButton).prop('disabled', true);
    // HERE SOME AJAX STUFF
    $(senderButton).prop('disabled', false);
}

编辑：我用淘汰赛'启用'绑定来实现它：

<button type="button" class="btn btn-primary pull-right"
    data-bind="click: clickAction.bind($data, 'start'), enable: !isLoading()">Start
</button>

Answer 1

更改您的观点：

 <button type="button" class="btn btn-primary pull-right"
    data-bind="click: clickAction.bind($data, 'start'), disable: ajaxInProgress">Start
</button>

然后在视图模型中定义ajaxInProgress observable：

var ajaxInProgress = ko.observable(false);

您还需要在视图模型中公开该observable。

在clickAction事件处理程序中，您需要在发送AJAX请求之前将observable设置为true，然后在收到响应时返回false：

this.clickAction = function (actionType) {
    ajaxInProgress(true);
    // possibly incorrect jQuery AJAX call syntax...
    $.get({
        // ... URL, method, and other params ...
        success: function () {
            ajaxInProgress(false);
            // ... other actions when data is loaded ...
        },
        error: function () {
            ajaxInProgress(false);
            // ... other error handling ...
        }
    });
}

请注意，我在ajaxInProgress(false)调用后的行上没有$.get，因为这会在发送请求后立即发生，而不是等到收到响应。它必须在回调中。

Durandal＆amp;淘汰赛：在ajax请求

1 个答案: