aleherzko aleherzko - 2 months ago 4x
jQuery Question

Hide specific elements onload or ready or page:change if select tags have specific value

I'm trying to hide some elements when a page is loaded.

Currently I'm using

because I'm working in Ruby on Rails with Turbolinks.

If the div contains a select tag with a specific value, I want to hide some elements.

The page can contain multiple of those select tags, so I can't use ID's.

Code here does not work:

$(document).on('page:change', function(){

if ($('.q_type_select').val() == 'text' || $('.q_type_select').val() == 'area') {

I guess that
only works if you click?

If I do this:

$(document).on('page:change', function(){

if ($('.q_type_select').val() == 'text' || $('.q_type_select').val() == 'area') {

I get all of the elements that have that class to hide and not the ones I want.

Any suggestions?


Assuming whatever you have there is correct (since there is no HTML to look to). Try this

    var $this = $(this);
   if ($this.val() == 'text' || $this.val() == 'area') {


Loop through all of the element with .q_type_select present in the page on document ready function and hide()