How to hide a set field label

Hi all,
I'm trying to rerender a field set based on the selected picklist value, so I thougth to use a script, but I have the following problem: I tried to use a class to refer every field in the set, but the lable don't diappear: so I have to refer each element in order to delete the field label, but I'd like to use the class so I can use just one instruction (tried with ). I show you the code: can anyone helpe me?

Vf page:

   <apex:selectList label="Seleziona tipologia" id="tiporecord" value="{!type}" multiselect="false" size="1" required="true" onchange="mostraCampoAggiuntivo(this.options[this.selectedIndex].value)" >
       <apex:selectOption itemValue="" itemLabel="- Seleziona un valore -"/>
       <apex:selectOption itemValue="Domanda" itemLabel="Domanda"/>
       <apex:selectOption itemValue="Risposta" itemLabel="Risposta"/>
       <apex:selectOption itemValue="Avviso" itemLabel="Avviso"/>
       <apex:selectOption itemValue="Soluzione" itemLabel="Soluzione"/>
       <apex:selectOption itemValue="Conclusione" itemLabel="Conclusione"/>
       <apex:actionSupport event="onchange" action = "{!returnType}" reRender="topPanel"/>
   </apex:selectList>
   <apex:outputText value="Pending" label="Stato" />
   <apex:inputField value="{!Troubleshooting__c.Testo__c}" style="width: 100%" required="true"/>
   <apex:outputField value="{!parentTS.Testo__c}" label="Nodo padre"/>
   <apex:inputField value="{!Troubleshooting__c.Testo_Aggiuntivo__c}" label="Testo Aggiuntivo" id="TestoAggiuntivo" style="display: none"/><br/>


   <apex:inputField value="{!Troubleshooting__c.Azione__c}" label="Azione" id="Azione" style="display: none" styleClass="flag"/>
   <apex:inputField value="{!Troubleshooting__c.Tracciamento__c}" label="Tracciamento" id="Tracciamento" style="display: none" styleClass="flag" />
   <apex:inputField value="{!Troubleshooting__c.FlagEsigenza__c}" label="Flag esigenza" label="FlagEsigenza" style="display: none" styleClass="flag" /><br/><br/>
   <apex:inputCheckbox value="{!Troubleshooting__c.Richiesta_Login__c}" label="Richiesta Login" label="RichiestaLogin" style="display: none" styleClass="flag"/>
   <apex:inputCheckbox value="{!Troubleshooting__c.Autorizzazione_Swap_Materiale__c}" label="Autorizzazione Swap Materiale" label="AutorizzazioneSwapMateriale" style="display: none" styleClass="flag" />
   <apex:inputCheckbox rendered="false" />
   <apex:inputCheckbox value="{!Troubleshooting__c.DigitalKey__c}" label="DigitalKey" id="DigitalKey" style="display: none" styleClass="flag" />
   <apex:inputCheckbox value="{!Troubleshooting__c.Aggiornamento_Servizi_DTT__c}" label="Aggiornamento Servizi DTT" label="AggiornamentoServiziDTT" style="display: none" styleClass="flag" />
   <apex:inputCheckbox value="{!Troubleshooting__c.Decoder__c}" label="Decoder" id="Decoder" style="display: none" styleClass="flag" />
   <apex:inputCheckbox value="{!Troubleshooting__c.Reset_PIN__c}" label="Reset PIN" id="ResetPIN " style="display: none" styleClass="flag" />
   <apex:inputCheckbox value="{!Troubleshooting__c.SmartCard__c}" label="SmartCard" id="SmartCard" style="display: none" styleClass="flag" />
   <apex:inputCheckbox value="{!Troubleshooting__c.Reset_SMC__c}" label="Reset SMC" label="ResetSMC " style="display: none" styleClass="flag" />
   <apex:inputCheckbox value="{!Troubleshooting__c.Telecomando__c}" label="Telecomando" label="Telecomando" style="display: none" styleClass="flag" />

Script:

   if(selected=='Conclusione'){
       console.log('*********selected: '+selected);
       $("[class$=flag]").css('display', 'block');
       $("[for$='Reset']").css('display','block');
       $("[for$='ResetPIN']").css('display','block');
       $("[for$='DigitalKey']").css('display','block');
       $("[for$='Telecomando']").css('display','block');
       $("[for$='SmartCard']").css('display','block');
       $("[for$='Decoder']").css('display','block');
       $("[for$='AutorizzazioneSwapMateriale']").css('display','block');
       $("[for$='AggiornamentoServiziDTT']").css('display','block');
       $("[for$='RichiestaLogin']").css('display','block');
       $("[for$='FlagEsigenza']").css('display','block');
       $("[for$='Tracciamento']").css('display','block');
       $("[for$='Azione']").css('display','block');
   }

February 3, 2015
·
Answer
·
Like
1
·
Follow
2

Zuinglio Lopes Ribeiro Júnior
Hello,

Try this:

<style type="text/css"> .fieldSetPanel { display: none; } </style> <apex:selectList label="Seleziona tipologia" id="tiporecord" value="{!type}" multiselect="false" size="1" required="true" onchange="mostraCampoAggiuntivo(this.options[this.selectedIndex].value)" > <apex:selectOption itemValue="" itemLabel="- Seleziona un valore -"/> <apex:selectOption itemValue="Domanda" itemLabel="Domanda"/> <apex:selectOption itemValue="Risposta" itemLabel="Risposta"/> <apex:selectOption itemValue="Avviso" itemLabel="Avviso"/> <apex:selectOption itemValue="Soluzione" itemLabel="Soluzione"/> <apex:selectOption itemValue="Conclusione" itemLabel="Conclusione"/> <apex:actionSupport event="onchange" action = "{!returnType}" reRender="topPanel"/> </apex:selectList> <apex:outputText value="Pending" label="Stato" /> <apex:inputField value="{!Troubleshooting__c.Testo__c}" style="width: 100%" required="true"/> <apex:outputField value="{!parentTS.Testo__c}" label="Nodo padre"/> <apex:inputField value="{!Troubleshooting__c.Testo_Aggiuntivo__c}" label="Testo Aggiuntivo" id="TestoAggiuntivo" style="display: none"/><br/> <apex:outputPanel layout="block" styleClass="fieldSetPanel"> <apex:inputField value="{!Troubleshooting__c.Azione__c}" label="Azione" id="Azione" styleClass="flag"/> <apex:inputField value="{!Troubleshooting__c.Tracciamento__c}" label="Tracciamento" id="Tracciamento" styleClass="flag" /> <apex:inputField value="{!Troubleshooting__c.FlagEsigenza__c}" label="Flag esigenza" label="FlagEsigenza" styleClass="flag" /><br/><br/> <apex:inputCheckbox value="{!Troubleshooting__c.Richiesta_Login__c}" label="Richiesta Login" label="RichiestaLogin" styleClass="flag"/> <apex:inputCheckbox value="{!Troubleshooting__c.Autorizzazione_Swap_Materiale__c}" label="Autorizzazione Swap Materiale" label="AutorizzazioneSwapMateriale" styleClass="flag" /> <apex:inputCheckbox rendered="false" /> <apex:inputCheckbox value="{!Troubleshooting__c.DigitalKey__c}" label="DigitalKey" id="DigitalKey" styleClass="flag" /> <apex:inputCheckbox value="{!Troubleshooting__c.Aggiornamento_Servizi_DTT__c}" label="Aggiornamento Servizi DTT" label="AggiornamentoServiziDTT" styleClass="flag" /> <apex:inputCheckbox value="{!Troubleshooting__c.Decoder__c}" label="Decoder" id="Decoder" styleClass="flag" /> <apex:inputCheckbox value="{!Troubleshooting__c.Reset_PIN__c}" label="Reset PIN" id="ResetPIN " styleClass="flag" /> <apex:inputCheckbox value="{!Troubleshooting__c.SmartCard__c}" label="SmartCard" id="SmartCard" styleClass="flag" /> <apex:inputCheckbox value="{!Troubleshooting__c.Reset_SMC__c}" label="Reset SMC" label="ResetSMC " styleClass="flag" /> <apex:inputCheckbox value="{!Troubleshooting__c.Telecomando__c}" label="Telecomando" label="Telecomando" styleClass="flag" /> </apex:outputPanel>

And I'm assuming that you have this script inside your mostraCampoAggiuntivo js function and that you have imported JQuery to your VisualForce and it's up-and-running.

Script:

if(selected=='Conclusione'){ $(".fieldSetPanel").css('display', 'block'); } else { $(".fieldSetPanel").css('display', 'none'); }

Regards.

Don't forget to mark your thread as 'SOLVED' with the answer that best helps you.

February 3, 2015
·
Like
0
·
Dislike
0

Salvatore Paracuollo
It doesn't work :(

February 3, 2015
·
Like
0
·
Dislike
0

Zuinglio Lopes Ribeiro Júnior

Well, I am surprised. That code should have worked.

Are you able to share your entire VisualForce so I can have a look? You can disguise names if needed.

Maybe we are missing something.

Regards.

February 3, 2015
·
Like
0
·
Dislike
0

Salvatore Paracuollo
Hi Zuiniglio, thank you for th e help.
The visualforce page is the following:

<apex:page standardController="Troubleshooting__c" extensions="TroubleshootingEditExtension" tabStyle="Gestione_contenuti_pubblici__tab">
<apex:includeScript value="{!$Resource.JQUERY_1_9_1}" />
<script>
var selected;
$( document ).ready(function() {
mostraCampoAggiuntivo(selected);
});
function mostraCampoAggiuntivo(selected){
if(selected=='Avviso' || selected=='Soluzione' ){
$("[id$='TestoAggiuntivo']").css('display','block');
$("[for$='TestoAggiuntivo']").css('display','block');
}
else{
$("[id$='TestoAggiuntivo']").css('display','none');
$("[for$='TestoAggiuntivo']").css('display','none');
}

if(selected=='Conclusione'){
console.log('*********selected: '+selected);
$("[class$=flag]").css('display', 'block');
$("[for$='ResetPIN']").css('display','block');
$("[for$='ResetSMC']").css('display','block');
.
               .
               .

}
else{
$("[class$=flag]").css('display', 'none');
$("[for$='ResetPIN']").css('display','none');
$("[for$='ResetSMC']").css('display','none');
.
               .
               .

}
}
</script>

<apex:sectionHeader title="Modifica record" subtitle="Troubleshooting"/>
<apex:form id="formNodo">
<apex:pageMessages />
<apex:outputpanel rendered="{!nuovo}">
<apex:pageMessage title="ATTENZIONE!" summary="Questo nodo sarà salvato con Stato Pending e non sarà visibile nel front end fino a che non verrà attivato" severity="warning" strength="2" />
</apex:outputPanel>
<apex:outputPanel rendered="{!modifica}">
<apex:pageMessage title="ATTENZIONE!" summary="Una volta effettuata la modifica il nodo corrente e tutti i suoi figli
verranno messi in stato Pending" severity="warning" strength="2" />
</apex:outputPanel>
<apex:pageBlock mode="edit" >
<apex:pageblockButtons >
<apex:commandButton value="Salva e torna al Troubleshooting" action="{!recordSalvato}"/>
<apex:commandButton value="Salva e nuovo" action="{!salvaENuovo}" />
<apex:commandButton value="Salva e aggiungi figlio" action="{!salvaEFiglio}" />
<apex:commandButton value="Annulla" action="{!annulla}" immediate="true" rendered="{!nuovo}"/>
<apex:commandButton value="Annulla" action="{!annullaModifica}" immediate="true" rendered="{!modifica}"/>
</apex:pageblockButtons>
<apex:pageblockSection title="Nuovo record" id="nuovoRecord" rendered="{!nuovo}">
<apex:selectList label="Seleziona tipologia" id="tiporecord" value="{!type}" multiselect="false" size="1" required="true" onchange="mostraCampoAggiuntivo(this.options[this.selectedIndex].value)" >
<apex:selectOption itemValue="" itemLabel="- Seleziona un valore -"/>
<apex:selectOption itemValue="Domanda" itemLabel="Domanda"/>
<apex:selectOption itemValue="Risposta" itemLabel="Risposta"/>
<apex:selectOption itemValue="Avviso" itemLabel="Avviso"/>
<apex:selectOption itemValue="Soluzione" itemLabel="Soluzione"/>
<apex:selectOption itemValue="Conclusione" itemLabel="Conclusione"/>
<apex:actionSupport event="onchange" action="{!returnType}" reRender="topPanel"/>
</apex:selectList>
<apex:outputText value="Pending" label="Stato" />
<apex:inputField value="{!Troubleshooting__c.Testo__c}" style="width: 100%" required="true"/>
<apex:outputField value="{!parentTS.Testo__c}" label="Nodo padre"/>
<apex:inputField value="{!Troubleshooting__c.Testo_Aggiuntivo__c}" label="Testo Aggiuntivo" id="TestoAggiuntivo" style="display: none"/><br/>

<apex:inputCheckbox value="{!Troubleshooting__c.Reset_PIN__c}" label="Reset PIN" id="ResetPIN" style="display: none" styleClass="flag" />
<apex:inputCheckbox value="{!Troubleshooting__c.Reset_SMC__c}" label="Reset SMC" id="ResetSMC" style="display: none" styleClass="flag" />
               .
               .
               .

</apex:pageblockSection>

<apex:pageblockSection title="Modifica record" rendered="{!modifica}">
<apex:outputField value="{!Troubleshooting__c.RecordType.Name}" label="Tipologia"/>
<apex:outputText value="Pending" label="Stato"/>
<apex:inputField value="{!Troubleshooting__c.Testo__c}" style="width: 100%" required="true"/>
<apex:outputText value="{!parentNode}" label="Nodo padre" />
<apex:inputField value="{!Troubleshooting__c.Testo_Aggiuntivo__c}" label="Testo Aggiuntivo" rendered="{!OR(if(Troubleshooting__c.RecordType.Name =='Soluzione',true, false ),if(Troubleshooting__c.RecordType.Name =='Avviso',true, false))}"/>
<apex:outputField value="{!Troubleshooting__c.Id_Padre__c}" label="Nodo padre" rendered="false"/>
<apex:outputField value="{!Troubleshooting__c.Stato__c}" rendered="false"/>
<apex:outputField value="{!Troubleshooting__c.Livello__c}" rendered="false"/>


<apex:inputField value="{!Troubleshooting__c.Tracciamento__c}" style="width: 100%" rendered="{!if(Troubleshooting__c.RecordType.Name =='Conclusione',true, false )}" />
<apex:inputField value="{!Troubleshooting__c.Azione__c}" rendered="{!if(Troubleshooting__c.RecordType.Name =='Conclusione',true, false )}" />
<apex:inputField value="{!Troubleshooting__c.FlagEsigenza__c}" style="width: 100%" rendered="{!if(Troubleshooting__c.RecordType.Name =='Conclusione',true, false )}" />


<apex:inputCheckbox value="{!Troubleshooting__c.Reset_PIN__c}" label="Reset PIN " rendered="{!if(Troubleshooting__c.RecordType.Name =='Conclusione',true, false )}" />
<apex:inputCheckbox value="{!Troubleshooting__c.Reset_SMC__c}" label="Reset " rendered="{!if(Troubleshooting__c.RecordType.Name =='Conclusione',true, false )}" />
               .
               .
               .

</apex:pageblockSection>
</apex:pageBlock>
</apex:form>
</apex:page>

February 4, 2015
·
Like
0
·
Dislike
0

You need to sign in to do that.

Need an account? Sign Up

Have an account? Sign In

Dismiss

Browse by Topic

Welcome to Support!

Show

sorted by

How to hide a set field label

You need to sign in to do that.