dojo - タブ内のデータの状態に基づいて、dijit.layout.TabContainer がタブを切り替えないようにするにはどうすればよいですか?

Question

タブなどを無効にする方法を知っています。

これは、ユーザーが条件を満たさない場合に、onclick イベントがアクティブなタブに切り替わらないようにするためのものです。

dojo.stopEvent() を使用できるイベントを渡すために接続できる関数はありますか?

Answer 1

アスペクトでもこれを行うことができます。

aspect.around(tabContainer, "selectChild", function(selectChild) {
        return function(page) {
            if(confirm("Do you want to change tab?"))
                selectChild.apply(this, arguments);
        }
});

フィドル: http://jsfiddle.net/vmsuu/4/

Fredde の功績: http://dojo-toolkit.33424.n3.nabble.com/dijit-layout-TabContainer-Confirm-message-on-switching-tabs-td3990778.html

Answer 2

私は同じ問題を抱えています。それを行う直接的な方法はありませんが、ウィジェットを拡張できます:

dojo.extend(dijit.layout.TabController, {
    onButtonClick: function(/*dijit._Widget*/ page,evt) {
        // summary:
        //      Called whenever one of my child buttons is pressed in an attempt to select a page
        // tags:
        //      private
        this.beforeButtonClick(page,evt);
        this._onButtonClick(page,evt);

    },
    beforeButtonClick:function(page,evt){

    },
    _onButtonClick:function(page,evt){
        console.log(evt.cancelBubble);
        if(evt.cancelBubble){
            return;
        }
        var container = dijit.byId(this.containerId);
        container.selectChild(page);
    }
});

使用法は次のとおりです。

var widget = dijit.byId('your_tabContainer');
dojo.connect(widget.tablist,"beforeButtonClick",function(page,evt){
//do the detection, if it meet the condition, ignore it,
//if not, stop the event
   if(page.id !== "tab1"){
      dojo.stopEvent(evt)
   }
});