Individual column searching (select inputs) where cell contains select element

Individual column searching (select inputs) where cell contains select element

alexwilliams79alexwilliams79 Posts: 1Questions: 1Answers: 0

Hi, I have been following this example: https://datatables.net/examples/api/multi_filter_select.html

It is working great on regular columns containing text in cells but in one of my columns (the "Assigned To" column in the image below) you will see I have a Select element created using the following code:

var $select = $("<select class='assigner form-control'><option value='1'>Seb</option><option value='2'>Luke</option><option value='1002'>Unassigned</option><option value='1003'>Kevin</option><option value='1004'>Mark</option></select>");

When I apply the filter code referenced in the link above to this "Assigned To" column it (understandably) displays the Select's values e.g. 1, 2, 1002, 1003 and 1004 rather than the Select's text e.g. Seb, Luke, Unassigned, Kevin, Mark.

Please could you advise how I can get the Select's text to display in the filter box in the footer rather than displaying the Select's value in the filter box in the footer.

Hope this screen shot makes things a little clearer:

I did see @kender comment in the Comments section of the above referenced link where they state:

I have applied this code but still get the same result and I'm not smart enough to understand how to adapt it I'm afraid. Any help would be greatly appreciated. Many thanks in advance.

Answers

  • colincolin Posts: 15,143Questions: 1Answers: 2,586

    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

  • kthorngrenkthorngren Posts: 20,296Questions: 26Answers: 4,768
    edited September 2021

    Maybe you can iterate through the $select variable like this:

      $( $select ).find('option').each(function() {
        select.append( '<option value="' + $(this).text() + '">'  + $(this).text() + '</option>');
      });
    

    If this doesn't help then please provide the test case Colin asked for so we can provide more specific help.

    Kevin

Sign In or Register to comment.