Drop-down list that filters based upon hidden column

Drop-down list that filters based upon hidden column

simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0

I'm sure there's an easy fix for this, but I'm trying to make a drop-down button/list (already accomplished using the "collection" button) where the revealed buttons will filter the table by preset terms (this is where I struggle).

The JS Fiddle: http://jsfiddle.net/#&togetherjs=m8nlzA2Lez

There's a hidden column called "Roche Sector" with a finite list of terms in various combinations. Some genes have multiple terms assigned. I'd like to have a drop down list that includes all of these terms (not all their combinations) which, when clicked, will filter the table by the listed term. (Currently the button with a real term just gives a goofy alert when clicked.)

I've considered using an approach similar to the DataTables filter-by-column dropdown, but I can't seem to get it to appear with a hidden column. There are also some issues with using that, as the functionality wouldn't be quite the same as a filter that does a search within the larger string.

I'd love any help in getting this to work! I appreciate your time and consideration.

This question has an accepted answers - jump to answer

Answers

  • simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0

    Alternatively, I could have an external selector where each term is linked to a filter command for the table. That'd be exceedingly helpful as well!

    I really would love to know how to link a button (any button!) to a reversible filtering of the data table by a predetermined string.

    (Sorry to be so pesky.)

  • daniel_rdaniel_r Posts: 460Questions: 4Answers: 67
    Answer ✓

    you can use my yadcf, it has the filter_container_id attribute that you can set with some external div id and your filter will be placed there, take a look at the example:

    http://yadcf-showcase.appspot.com/DOM_source.html

  • simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0

    Hi! Thank you so much for taking the time to look at this!

    I'm running into a few issues. I'm able to get column sorts to appear on every column header... except the last one, which is the one in which I'm interested (it's not hidden yet, either). Not sure why.

    I've also played around with the "filter_container_id" attribute, to no avail. I can move the sort selector to a cell in the table for some reason, but it won't appear in a different table header or an external div.

    I've tried backing into it (I took your example page and just substituted my table in place of yours, with terms of interest spanned as were your tags), but that also hasn't worked.

    Any thoughts or suggestions? I'm poring over your extensive instructions, but it's not quite working. I apologize; I'm new to this.

    Anyway, if you're free, let me know! :)

  • daniel_rdaniel_r Posts: 460Questions: 4Answers: 67

    I need a working example jsbin/jsfiddle that reproduces your scenario, because the filter_container_id should work, just make sure you provide a valid id and that element is visible in your page, also make sure you are using the right column number (start with zero for the first column)

  • simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0

    Here's a JSFiddle with what I've done so far using your YADCF things. I'm not sure how to get your files onto JSFiddle, though, so do with it what you will:

    http://jsfiddle.net/#&togetherjs=tOzLmQhfio

    And for a big picture of sorts, here's a JSFiddle with what I'd like to work. Everything is where it's supposed to be, but the buttons don't do anything.

    http://jsfiddle.net/#&togetherjs=7P2llVnm6M

    It is fairly important for the seventh column to be hidden, as its contents are very large and distort the colored cells (which should be roughly small).

    Again, thank you for taking the time to help me!

  • daniel_rdaniel_r Posts: 460Questions: 4Answers: 67

    those jsfiddles contain nothing... please provide a working example so I can take a look at it...

  • simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0
  • daniel_rdaniel_r Posts: 460Questions: 4Answers: 67

    they both asking for "Join Collaboration session?" just create a simple jsfiddles or jsbin example to show your problem

  • simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0

    http://jsfiddle.net/2u8zje4b/

    Maybe this works? I literally cannot...

  • simonandmeowcelinesimonandmeowceline Posts: 7Questions: 1Answers: 0

    Daniel,

    I'm so sorry for all of the hassle! I decided to go even further back in the posts to try and find a solution, and an older post that you wrote (http://www.datatables.net/forums/discussion/22499/installing-fnmultifilter) did the trick!

    Within my button collection, I can use an "fnClick" like the following to search a predetermined term of interest.

    "fnClick": function ( nButton, oConfig, oFlash ) {
    table
    .column( 6 ).search( 'Amino Acid Metabolism: Glutamate, Proline, Hydroxyproline' )
    .draw();
    }

    I know this has been a really ratchet post, but I'm so excited! Thank you so, so much for your time and patience! :D

This discussion has been closed.