Hide Tab depending on condition

Discussions about Forms Designer for SharePoint 2013 / 2016 and Office 365.
Locked
CI_Jack
Posts: 4
Joined: Mon Jun 11, 2018

12 Jun 2018

Has any one worked out how to hide a tab

I'm looking to hide / show tabs depending on the status field

many thanks in advance

J

User avatar
Nikita Kurguzov
Posts: 889
Joined: Mon Jul 03, 2017

12 Jun 2018

Dear Jack,
Please, check out the following article - https://spform.com/javascript-framework ... point-2010
Cheers

CI_Jack
Posts: 4
Joined: Mon Jun 11, 2018

12 Jun 2018

thanks,

I have used the following JS but it doesn't work, the field I am referring to internal name is Status, and its the 4th tab called Lost reason

// Enable or disable 'Resolution' tab
function setResolutionTab() {
var v = fd.field('Status').control().value();
if (v == 'Closed - Lost' || v == 'Closed - No Bid' ) {
$('#fd_tabcontrol-0').tabs('option', 'disabled', null); // Enable
} else {
$('#fd_tabcontrol-0').tabs('option', 'disabled', [3]); // Disable
}
}

// Subscribe on status change
fd.field('Status').control().change(function () {
setResolutionTab();
});

// Initialize
setResolutionTab();

User avatar
Nikita Kurguzov
Posts: 889
Joined: Mon Jul 03, 2017

12 Jun 2018

Dear Jack,
The code is used to disable the tab. You also need to have the following CSS to hide it:

Code: Select all

.ui-tabs .ui-state-disabled {
  display: none; /* disabled tabs don't show up */
}
If this doesn't work, check how many Tab controls you have. If you have more than one, then you'll need to replace #fd_tabcontrol-0 with #fd_tabcontrol-1 or #fd_tabcontrol-2. Also, check the internal name and values of Status field to make sure it's the same as the ones you use in the code.
Cheers

Locked
  • Information
  • Who is online

    Users browsing this forum: No registered users and 22 guests