Question

我正在使用OpenERP-odoo模块。

在哪个切换按钮用于在点击时显示发布 - 取消发布。每次点击都有一些后台处理使用json rpc

获取数据

我希望.hide()此切换按钮的持续时间为后台进程[Inshort：我不想立即切换此按钮]

        $(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 ready类来显示“loading ..”状态

如何使用jQuery切换按钮调用ajax

2 个答案: