Filter selectbox column based on text not values

darshitj2

I love DataTables plugin. There are different columns in my DataTables with different control type. One of them is having select box. While rendering through cellRender i am set both the value and text of the options like
<option value="1">Sam</option>
<option value="2">Brad</option>
<option value="3">Nicholas</option>

also i am applying the filter and search properties to my DataTable
searchable: true,
showFilters: true,
for this particular select box column it shows list of "Value" attribute in filter box on top of the column like 1,2,3..

A user might get confused when user sees text in the cells and values in the filter box of which user is totally unaware.

Is there any way to list the texts values in filter box rather than their "Value" attribute.

darshitj2

@allan Could you please help me

allan

I don't know how your select elements are being created. Could you clarify that please? I also don't know what the showFilters: true, property is doing - that isn't a part of DataTables core.

Allan

darshitj2

            key: 'Action',
            configurable: false,
            label: 'Actions',
            sortable: false,
            exportable: false,
            showFilters: true,
            searchable: true,
            filterable: {
                type: 'text'
            },
            cellRender: function (cell, **cellData, rowData**) {

                var html = [
                   ---------------------
                ].join('');

                $(cell).html(html).addClass('nowrap')
            }

@allan in rowData/CellData we have the required data which we want to display. So i just create the html tags as required and join it to row of the table. In the same way i create select tag html and join it.

showFilters: true, It allows to have filter feature on top of the column
And filterable: {
type: 'text'
},

defines the type of filter box (it can be select also).

allan

It sounds like whatever filtering library you are using is reading the text from the select input element. You'd need to change it to read only the selected value.

Allan