如何使用 ajax 呼叫与 jQuery 切换按钮

Question

我正在使用 OpenERP-odoo 模块。

其中切换按钮用于显示点击时发布-取消发布。每次点击都有一些后台进程 使用 json rpc

获取数据

我想 .hide() 在后台进程期间持续使用此切换按钮 [简而言之：我不想立即切换此按钮]

        $(document).on('click', '.js_publish_management .js_publish_btn', function () {
            var $data = $(this).parents(".js_publish_management:first");
            var self=this;
            openerp.jsonRpc($data.data('controller') || '/website/publish', 'call', {'id': +$data.data('id'), 'object': $data.data('object')})
                .then(function (result) {
                    $data.toggleClass("css_unpublished css_published");
                    $data.parents("[data-publish]").attr("data-publish", +result ? 'on' : 'off');
                }).fail(function (err, data) {
                    website.error(data, '/web#return_label=Website&model='+$data.data('object')+'&id='+$data.data('id'));
                });
        });

我不熟悉 Ajax 调用。谁能指导我！ TIA.

Answer 1

在函数的第一行调用 .hide() 元素。然后在 ajax 调用中添加 .always() 函数来显示它：

 $(document).on('click', '.js_publish_management .js_publish_btn', function () {
     var $data = $(this).parents(".js_publish_management:first");
     var self=this;

     //hide your element here
     element.hide();

     openerp.jsonRpc($data.data('controller') || '/website/publish', 'call', {'id': +$data.data('id'), 'object': $data.data('object')})
         .then(function (result) {
         $data.toggleClass("css_unpublished css_published");
         $data.parents("[data-publish]").attr("data-publish", +result ? 'on' : 'off');
         }).fail(function (err, data) {
             website.error(data, '/web#return_label=Website&model='+$data.data('object')+'&id='+$data.data('id'));
         }).always(function(){
             //show your element again. Once the call is resolved either way
             element.show();
         });
    });

Answer 2

            $('.btn-group').ready( function () {
                $('.btn-group').button('loading');
                openerp.jsonRpc($data.data('controller') || '/website/publish', 'call', {'id': +$data.data('id'), 'object': $data.data('object')})
                    .then(function (result) {
                        $data.toggleClass("css_unpublished css_published");
                        //do something
                        $('.btn-group').button('reset');
                    }).fail(function (err, data) {
                        //do something
                        $('.btn-group').button('reset');
                    });
            });

您可以尝试使用 bootstrap 就绪 class 来显示 'loading..' 状态

如何使用 ajax 呼叫与 jQuery 切换按钮

how to use ajax call with jQuery toggle button

ajax

jquery

jsonp

onclick

openerp