CODEWITHSUNDEEP
datatables
Miguel
Miguel

Reputation: 2079

Filter other columns based on first columns

I'm using jquery data tables and I'm assigning an array of values to the initialization of the data table. The table basically looks like this. enter image description here

based on an an radio button I would like to limit the items that are display in the table and the items that are searched in the table. For my example it would be based on the "Chart column". I want to limit the table to only show the items that are based on chart "D" or Chart "S". Here is how I'm initializing the table.

if (!$.fn.DataTable.isDataTable( '#fundLookUptbl' ) ) {
                 fundTable =  $('#fundLookUptbl').DataTable( {
                    data: funds,
                    columns: [
                        { "mData": "chart" },
                        { "mData": "fund"  },
                        { "mData": "orgDefault" },
                        { "mData": "progDefault" }
                    ]
                 } );
                 var filteredData = fundTable
                     .columns( [0, 1] )
                     .data()
                     .eq( 0 )
                     .filter( function ( value, index ) {
                         return value = 'D' ? true : false;
                     } );

            }

This is obviously not working, and the filterData variable is a lousy attempt on trying to make it work. I'm having a hard time understanding the API's. So the question is , How can initialize the table to only show the items that are based on a given chart. I know that I can remove the items of the array but i don't want to do that since I would simple like to be able to switch between chart "D" and "S" but still continue to search through the other columns.

Upvotes: 1

Views: 836

Answers (3)

UserEsp
UserEsp

Reputation: 426

I´m not sure to be understanding what you want to do but here are some options:

One way is selecting by default value example "s". You can use a dropdown is easier to handled .Then select with jQuery the dafault value "s" on that dropdown and add a function 

 $("#DropdownId").change(function () {
       var chart=$("#DropdownId").val();
    });
 $.ajax({
            url: "url")",//url to reload page with new value
            type: "POST",
        data: {chart:chart},
        success: function (data) {           
        }
        });

    });

on this way the filter is on backend. If you want to do something on the row depending of a column value you shoud to add something like this 

"fnRowCallback": function (nRow, mData, iDisplayIndex, iDisplayIndexFull) {

                 if (mData["chart"] =="s") {
                  return nRow;
                    }
                },

Datatables: custom function inside of fnRowCallback.

Good luck

Upvotes: 1

Rafael Teles
Rafael Teles

Reputation: 2748

I believe that filtering the column would solve your problem. 

table.column(0).search('Bruno').draw()

So you could just filter the column when the radio button selection change

Here is a fiddle example

Upvotes: 2

BleepBloopOverflow
BleepBloopOverflow

Reputation: 1

 fundTable.order( [0, 'asc'] );

Try that or look at this particular page for reference:

https://datatables.net/reference/api/order%28%29 Basically orders in pair of columnIndex in either asc(ending) or desc(ending) order.

Upvotes: 0

Related Questions