Skip to main content

We are implementing our own theme and have noticed that the hidden tabs of a smartform are not actually hidden completely. You can still see a gap for each hidden tab. In the following picture, we have 6 hidden tabs (notice the gap between tab 3 and tab 4):

 

12951iFF6BCE382640CD51.png

 

If the parent <li> tag was given the 'display:none;' instead, this would not be an issue. 

 

Maybe this is a bug fix suggesiton for a future version but is there a workaround in the mean time?

 

Thanks,

Reece

Dear , 

 

Ive tried ur scenario , and u were right , and ive found a solution that u could use Javascript to margin-left ur last tab , 

u could go to the specific form ur on , and add data label , go to expression and add a new expression 

 

<script type="text/javascript">$( document ).ready(function() { $("#00000000-0000-0000-0000-000000000000_4248e42b-b91f-927c-1a9a-db462f6abd76").css("margin-left","-3px");

})</script>

 

Just replace the id of the <a> of ur last tab with the id im using , and change the amount of pixels u want to margin ,

(best way i would use to measure how many pixels to margin , is by inspecting the element in google chrome and test it there)

 

Note : Make sure "Literal" property is checked in ur data label , so ur JS works ,

Also remember that this work arround could be dynamically set , since i  assume that u r hiding/showing tabs dependent on some kind of a "value" on ur form ,

to work arround that , for example , 

If (......) {} <--- when this state happens to be true , it will show/hide specific tabs , so u could have multiple data labels with multiple java scripts ,

and depending on the state/value , just use "set controls properties" and set the literal to checked , to fire ur java script .

 

Hope it helps!

Best regards.


Reply