Individual column searching (select inputs) with buttons?

pirate666

Hi!

I applied to my datatable individual column searching (select inputs) to a column that has a button (with a tag) in each row in the following way:

<td><a style="pointer-events:none;" class="btn btn-danger btn-xs">Pending</a></td>

So the select option is generated in the following way (extracted from the chrome inspector):

<option value="<a style=" pointer-events:none;"="" class="btn btn-danger btn-xs">Pending">Pending</option>

What can I do to keep my button and that the option is generated correctly like this:

<option value="Pending">Pending</option>
?

Thanks in advance.

pirate666

For now what I have done has been to generate the option manually in this way:

        initComplete: function () {
                    this.api().columns(3).every( function () {
                        var column = this;
                        var select = $('<select><option value=""></option></select>')
                            .appendTo( $(column.footer()).empty() )
                            .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 ) { 
                            select.append( '<option value="Pending">Pending</option>' )
                            select.append( '<option value="Pending2">Pending2</option>' )
                    //  } );
                    } );
                }

Because they are always a few, but it does not work for me when there are a lot of buttons.

Thanks.

colin

Hi @pirate666 ,

We're happy to take a look, but it would help, as per the forum rules, if you could link to a running test case showing the issue so we can offer some help. 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