Edit: I think the problem is in my self.providers = ko.computed(), I'm overwriting my providers array on the filter button click;
I've two fiddles up, both have everything in the HTML pane as I'm developing everything locally and it's just easier to copy/paste the entire file into jsfiddle rather than break it out.
I also have stubbed in a rather large dummy data object. This starts at line 110, so if you copy/paste/run it locally on your end, you'll definitely want an editor that can minimize that data object!
First fiddle is at http://jsfiddle.net/82cK7/ and seems to work fine, but it's "live" filtering. I just started with the provider name filtering, then added the jquery UI datepicker for date filtering as well. This will filter the data table when you change anything up in the green filter area.
Pertinent code here is self.filterClaims at line 196
Second fiddle is at http://jsfiddle.net/tq8zc/ and doesn't quite work right. The filtering here doesn't kick in until you click the "filter" button (this is the behavior I really want). It filters the table, but it also blows out my self.providers which generates a unique list of provider names for that select/dropdown. So, before you filter this, you have a list of multiple provider names. After you filter, you only have the provider you selected before you hit "filter".
Pertinent code here is self.claimsFiltered at line 166
I feel like I'm missing something pretty obvious and was wondering if I can get a set of other eyes looking at the code.
Thanks much for any help!
Here's one simple way to do it. I just added a currentFilter observable that contains the latest filter properties, and the filter button just updates this with the new filter values. Hope this helps. Updated fiddle: http://jsfiddle.net/antishok/tq8zc/2/