Skip Navigation

[Resuelto] custom code to hide a accordion depending on selection

Este hilo está resuelto. Aquí tiene una descripción del problema y la solución.

Problem:
Show/hide accordion according to Select field option.

Solution:
I have updated the following JS code in View >> JS editor section and it resolved the issue:

//display tenure only when select 'For Sale'
   function display_tenture(){
     $("div[data-target='#collapse-tenure']").parent('div.panel-info').hide(); 
     //hide Tenure
     $('select[name="property-type"]').change(function(){
          
     if(this.value == 'For Sale') {
        $("div[data-target='#collapse-tenure']").parent('div.panel-info').show(); 
        //show Tenure
      }
      else{
        $("div[data-target='#collapse-tenure']").parent('div.panel-info').hide(); //hide Tenure
      }
    });
//display tenure when select 'for Sale' on page loaded
     if($('select[name="property-type"]').val() == 'For Sale'){
        $("div[data-target='#collapse-tenure']").parent('div.panel-info').show(); //show Tenure
     }
   }
This support ticket is created hace 7 años, 1 mes. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Hoy no hay técnicos de soporte disponibles en el foro Juego de herramientas. Siéntase libre de enviar sus tiques y les daremos trámite tan pronto como estemos disponibles en línea. Gracias por su comprensión.

Sun Mon Tue Wed Thu Fri Sat
- 12:00 – 17:00 12:00 – 17:00 12:00 – 17:00 12:00 – 17:00 12:00 – 17:00 -
- 18:00 – 21:00 18:00 – 21:00 18:00 – 21:00 18:00 – 21:00 18:00 – 21:00 -

Supporter timezone: Asia/Karachi (GMT+05:00)

Este tema contiene 6 respuestas, tiene 2 mensajes.

Última actualización por Akhil hace 7 años, 1 mes.

Asistido por: Noman.

Autor
Mensajes
#579964

Hi Noman, as requested ,

the login that you have its valid.
the code is at wp archieve : enlace oculto
JS code is at filter editor section , current code is for checkbox. i need it for select option field.

thanks.

#579972

Noman
Supporter

Idiomas: Inglés (English )

Zona horaria: Asia/Karachi (GMT+05:00)

Hi,

Thanks for details, is it on that same page that we were working on landed-houses, this one?
enlace oculto

"select option field" -- For which particular field you need it for, please kindly mention name or slug of the field so I can easily find it, there are various fields.

Thank you

#580075

Hi Noman, yes its the same part.

the field is " property type" . thanks.

Acccordion "Tenure" show first.
then if property type = for sale Show Acccordion "Tenure"
if property type = for rent Hide Acccordion "Tenure"

thanks.

#580098

Hi Noman,

pls let me know if you need more details on this. thanks.

#580152

Noman
Supporter

Idiomas: Inglés (English )

Zona horaria: Asia/Karachi (GMT+05:00)

Thanks for providing details. I believe I have it all now. I am working on it and will update you with my findings.

Thank you

#580193

Noman
Supporter

Idiomas: Inglés (English )

Zona horaria: Asia/Karachi (GMT+05:00)

Hello,

I’ve updated following code for select option:

//display tenure only when select 'For Sale'
   function display_tenture(){
     $("div[data-target='#collapse-tenure']").parent('div.panel-info').hide(); 
     //hide Tenure
     $('select[name="property-type"]').change(function(){
		 
     if(this.value == 'For Sale') {
      	$("div[data-target='#collapse-tenure']").parent('div.panel-info').show(); 
        //show Tenure
      }
      else{
    	$("div[data-target='#collapse-tenure']").parent('div.panel-info').hide(); //hide Tenure
      }
    });
//display tenure when select 'for Sale' on page loaded
     if($('select[name="property-type"]').val() == 'For Sale'){
      	$("div[data-target='#collapse-tenure']").parent('div.panel-info').show(); //show Tenure
     }
   }

Please check the page now.

Thank you

#580197

Excellent ! Thanks. this is the line i was looking for

" if($('select[name="property-type"]').val() == 'For Sale') "

I shall close this ticket now.

Thank you very much for prompt reply Noman !