Dropdown filter with select2 not clickable after clicked

Dropdown filter with select2 not clickable after clicked

overstressoverstress Posts: 2Questions: 1Answers: 0

Hello, I have tried to use select2 for the dropdown select filter and this problem came out.
it working fine without select2.
The code:

initComplete: function () {
          this.api().columns([8]).every(function () {
            var column = this;
            var select = $('<select class="select2-filter"><option value="">placeholder</option></select>')
                    .appendTo('#filter-example')
                    .on('change', function () {
                      var val = $.fn.dataTable.util.escapeRegex(
                              $(this).val()
                      );
                      column
                              .search(val ? '^' + val + '$' : '', true, false)
                              .draw();
                    });
            column.data().unique().sort().each(function (d, j) {
              if (column.search() === '^' + d + '$') {
                select.append('<option value="' + d + '" selected="selected">' + d + "</option>");
              } else {
                select.append('<option value="' + d + '">' + d + "</option>");
              }
            })
          });
          $('.select2-filter').select2();
<thead>
                <tr>
                  <td colspan="11">
                      <div id="filter-example"></div>                 
                  </td>
                </tr>

When the page loads everything works fine and I click on the dropdown list and select the option to filter and table update data by the filter and I want to click the dropdown list again it not working not clickable but I notice if I resize browser windows width or I click other filter option and get back to click it again it works again and after that, it not clickable again
and it goes the same with other dropdown lists with select2 but the dropdown filter without select2 working fine.

Select2 version: 4.0.8
Datatable version : 1.10.19
Thanks

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • overstressoverstress Posts: 2Questions: 1Answers: 0

    Thank anyway I have found the problem and fixed

This discussion has been closed.