EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Aod47 on August 09, 2016, 11:01:41 PM



Title: How to hide close (x) button on tab, call from iframe?
Post by: Aod47 on August 09, 2016, 11:01:41 PM
I created dynamic tabs from the example code.

Code:
function addTab(title, url){
    if ($('#tt').tabs('exists', title)){
        $('#tt').tabs('select', title);
    } else {
        var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';
        $('#tt').tabs('add',{
            title:title,
            content:content,
            closable:true
        });
    }
}

In iframe content I have disabled form. When user click 'Edit Form' link button for enable form to edit data. I need to hide close (x) button on present selected tab. Prevent user close tab before save form.

I don't know how to refer to parent tabs object. Could you please advice?

Thank you.


Title: Re: How to hide close (x) button on tab, call from iframe?
Post by: jarry on August 10, 2016, 07:25:46 PM
Define a function to disable the current tab panel.
Code:
function disableCurrTab(){
  var t = $('#tt');
  var p = t.tabs('getSelected');
  var index = t.tabs('getTabIndex', p);
  t.tabs('disableTab', index);
}

And then call this function in your iframe: parent.disableCurrTab()


Title: Re: How to hide close (x) button on tab, call from iframe?
Post by: Aod47 on August 11, 2016, 12:03:12 AM
Ah!.. It's work great. Thank you very much.


Title: Re: How to hide close (x) button on tab, call from iframe?
Post by: Aod47 on August 21, 2016, 12:43:06 AM
I changed your code to

Code:
function disableCurrTab(){
  var t = $('#tt');
  var p = t.tabs('getSelected');
  var tab = p.panel('options').tab;
  tab.panel({ closable: false });
}
then the close (x) button hide when user click edit button

and I add function to show close (x) button agian.

Code:
function enableCurrTab(){
  var t = $('#tt');
  var p = t.tabs('getSelected');
  var tab = p.panel('options').tab;
  tab.panel({ closable: true });
}

But the close button not show.

Where am i missing? Could you please advice?

Thank you.


Title: Re: How to hide close (x) button on tab, call from iframe?
Post by: jarry on August 21, 2016, 05:20:29 PM
Please call this function to show or hide the close button.
Code:
function setCloseButton(closable){
  var t = $('#tt');
  var p = t.tabs('getSelected');
  t.tabs('update', {
    tab: p,
    type: 'header',
    options: {
      closable: closable
    }
  });
}


Title: Re: How to hide close (x) button on tab, call from iframe?
Post by: Aod47 on August 21, 2016, 11:05:52 PM
It's work great.

Thank you very much.  ;D