Search code examples
jqueryjquery-select2gravity-forms-plugin

Select2 & Gravity Forms. How to target multiple select fields. CSS class does not work


I'm using select2 on multiple Gravity forms with many select fields. The Select2 configuration for all select fields is the same but I can't seem to apply the script to all select fields and instead have to target each one using IDs.

What I'm having to do:

$('#input_4_0').select2({
  minimumResultsForSearch: Infinity,
  width:'100%'
});
$('#input_4_1').select2({
  minimumResultsForSearch: Infinity,
  width:'100%'
});


$('#input_4_2').select2({
  minimumResultsForSearch: Infinity,
  width:'100%'
});

What I'd like to do:

$('.js-select select').select2({
  minimumResultsForSearch: Infinity,
  width:'100%'
});

Have tried everything but nothing other than unique IDs works? Any help would be great


Solution

  • Try this syntax, the selector ^ is equivalent to startwith:

    // select all id beginning with input_4
    $('[id^=input_4]').select2({
      minimumResultsForSearch: Infinity,
      width:'100%'
    });