Individual column searching(select inputs) for Datatable column not having Unique Values and Sorting

beginner_2018

Dear All,

I have Column Name , And the input filter drop-down for this column is having duplicate values with no proper sort.
Jquery Data table is initially considering Value which is starting with CAPS (Upper Case) and then Lower case letters as shows below for all the columns.

Can any one please help me in knowing how can I solve it fiddle

colin

They're not duplicates, as your table does contain "CEDRIC KELLY" and "Cedric Kelly", which are two different values. If you want to combine the two, easiest way it to upper case or capitalise both, before adding to the dropdown. Likewise, it is sorted correctly - by default, most string sorts will show numbers first, then capitals, then lowercase.

C

beginner_2018

Colin thanks for your response,
But is it possible to get customize and make it work as per our requirment

colin

Yep, it just needs some code changes to when you populate the drop downs in this code of yours:

                     table.column(i).data().unique().sort().each(function (d, j) {
                         select.append('<option value="' + d + '">' + d + '</option>')
                     });

You just need to take the data, table.column(i).data() and manipulate it so it's how you want it.

beginner_2018

Sir,
I tried below options sir, but find no luck. Request you to please guide me.

table.column(i).order('asc').data().unique().sort().each(function (d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});

table.column(i).order('asc').draw(false).data().unique().sort().each(function (d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});

colin

Yep, you're not doing anything with the column data, you're still just putting into the dropdown as it appears in the table.

As I said, you need to change it, something like this pseudocode:

newArray = [];
table.column(i).data().unique().sort().each(function (d, j) {
    add capitalised string to newArray
});

resort newArray
for each in newArray - add to the dropdown

The DataTables bit is filled in, the rest is just standard JS, so you can look up how to do that, for example to capitalise the string, you can do this, to sort it, you can do this, etc.

Cheers,

colin

beginner_2018

Sir,
I tried through array, But find no luck with below lines.
Could you please do let me know what's wrong in it

   var dropdownvales = new Array();
   table.column(i).data().unique().sort().each(function (d, j) {
                  dropdownvales.push(d);
       });
   dropdownvales.sort();
    $.each(dropdownvales, function(index, value) {
                          select.append('<option value="' + value + '">' + value + '</option>')
            });

beginner_2018

Sir,

I am getting the result in with below lines , But the result is getting in the drop-down in single row.Could you please do let me know what's wrong in it

var share= new Array();
table.column(i).data().unique().sort().each(function (d, j)
{
share.push(d);
});
for ( var i = 0; i < share.length; i++ )
{
var a=i;
var b=i+1;
share.sort(function (a, b)
{
return a.toLowerCase().localeCompare(b.toLowerCase());
});
}
alert(share);
select.append('<option value="' + share+ '">' + share+ '</option>')

beginner_2018

Finally I got the sort what I required but unfortunately my filter option has stopped working for it.
Can any one please do let me know what's wrong in my below code

var share= new Array();
table.column(i).data().unique().sort().each(function (d, j)
{
share.push(d);
});
for ( var i = 0; i < share.length; i++ )
{
var a=i;
var b=i+1;
share.sort(function (a, b)
{
return a.toLowerCase().localeCompare(b.toLowerCase());
});
}
for ( var i = 0; i < share.length; i++ )
{
select.append('<option value="' + share[i] + '">' + share[i] + '</option>')
}

colin

Hi @beginner_2018 ,

That's a good stab. Take a look at the example here. There's three spellings for "Cedric Kelly", but only one in the dropdown.

Cheers,

Colin

beginner_2018

Sir,

Thanks for your kind support, I had used the above test code , And I see no movement for my requirement.
Because I see we are just making lower case to upper case ,But we are not able to have proper sort it .
I had changes the name column value form Alok Kumar to alok Kumar, And I see the value in input filter drop-down at the bottom .

fiddle