AngularJs + angular datatable

Question

Anyone here using angular-datatables in AngularJS?

Edited: I want to filter data in my table. In specific. like if the select is about category. It will only filter what's in the category column. But in my filter as of now. It filters everything.

Here is my code for filtering select. I just copy how the "search box" filtered the data. because I don't know the correct code for filtering using select. and It is customized.

function dtInstanceCallback (dtInstance) {
    var datatableObj = dtInstance.DataTable;
    vm.tableInstance = datatableObj;
}

function searchTable () {
    var query = vm.queryProductSearch;
    vm.tableInstance.search(query).draw();
}

function selectCategoryInTable () {
    var sel = vm.selCategory;
    vm.tableInstance.search(sel).draw();
}

function selectStatusInTable () {
    var sel = vm.selStatus;
    vm.tableInstance.search(sel).draw();
}

the searchTable() is for my search box. and selectCategoryInTable / selectStatusInTable is for my category column and status column in my table. But it filters everything.

And I want to know how to filter specific data. Like if I filter "ACTIVE". my data in datatable will show "INACTIVE" too because there's "ACTIVE" in "INACTIVE". so I want to filter specific word.

davidkonrad · Accepted Answer · 2016-08-24 09:37:22Z

0

It does not seem right. The correct usage of dataTables 1.10.x API from a dtInstance would be

vm.tableInstance.DataTable.search(query).draw()

if you want to search within a particular column, you can use

vm.tableInstance.DataTable.column(1).search(query).draw()

if you want to search for whole words, and not just part of words (like active vs inactive) then use a regular expression search. Wrap query into ^..$ and set first param to true, see docs for search() :

vm.tableInstance.DataTable.column(1).search('^'+query+'$', true).draw()

here is an example searching for foo in column #1 -> http://plnkr.co/edit/s1pP42YFE4WeuStdaK8d?p=preview

answered Aug 24, 2016 at 9:37

davidkonrad

85.7k17 gold badges211 silver badges273 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

jjjjjj Over a year ago

Thank you for answering my question. you really helped me there. Im sorry I can't add reputation to you. I'm still new here.

jjjjjj Over a year ago

but I have this problem. I tried to add this in my code. function selectStatusInTable () { var sel = vm.selectStatus; if(sel == 'ACTIVE' || sel == 'INACTIVE'){ vm.tableInstance.column(5).search('^'+sel+'$', true).draw(); } else if (sel == '') { vm.tableInstance.search(sel).draw(); } } because whenever I click "ALL" in my select. it shows nothing. but when I try to use if else. I won't show all data's with inactive and active when I click "ALL"

davidkonrad Over a year ago

@jjjjjj, sry for the delay, is at work myself :) great you figured it out!

Jayant Singh Over a year ago

@davidkonrad how to do this in angular 5 or 6. Please tell me i am stuck in this issue here is the link of my question

Collectives™ on Stack Overflow

AngularJs + angular datatable

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related