Is there a way to enable/disable a tabPanel within a tabset

  • 1
  • Question
  • Updated 4 years ago
I've been searching for an answer on this, but cannot find it. So I thought I ask.
I want to disable a Tab Panel within a TabSet. If so how?

Thanks.
Photo of Sofware Developer Guy

Sofware Developer Guy

  • 1,354 Points 1k badge 2x thumb

Posted 4 years ago

  • 1
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
When you say disable,  do you mean set component so it is read only?  Or do you mean "gray out" the tab and its related components?    Or do you mean hide completely? 

The hide completely is available using conditional rendering. 

The other two items would require some custom javascript that read values and conditionally adjusted the display on the page: 
  • In the first case you would need to  manipulate the fieldeditor.mode property to "read-only"   (see this forum post  https://community.skuidify.com/skuid/topics/_edit_mode_button )
  • In the second case would need to add a new dom element that applied the gray overlay,  and maybe adjust the css of the tab so it looked greyed out. 
Photo of Sofware Developer Guy

Sofware Developer Guy

  • 1,354 Points 1k badge 2x thumb
Hi Rob,
I mean the last case, Hide/unhide Completely.

Here is what I am trying to do: (I actually accomplished it but I don't think its efficient, since I resorted to some trickery).

Here is the popup as it comes up:

When you click on the "add Related Person" a new tab appears:


Here is the trickery:

When the popup loads I call this script:


Then when the user clicks on the button the following is called:


So as you can see, I have two buttons and two tabSets that I hide and show using jQuery.

I tried to just hide the Tab, using jQuery as well but was not successful.

What do you suggest?
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
What do I suggest?  -  I suggest you use whatever works, and it looks like your solution is functional. 

The action framework might allow this to happen with out code.   The button you added could modify the value of a field  (Say from False to True) using the "udpate field on row" action type.   And the tab could be conditionally rendered so that it only showed if the field value is True. 

The downside of this approach is that you need to have a field on your object to control this - rather than using a UI only solution as I believe you have coded..