How to use TH values as labels for dropdown search

How to use TH values as labels for dropdown search

potato_codepotato_code Posts: 14Questions: 5Answers: 0
edited July 2021 in Free community support

Hi,

I'm trying to get the column headers and use them as labels for the dropdown search. I've been able to append the search dropdown functionality to a Bootstrap Modal but I can't figure out the line of code. I've tried

$(this.table().header()).appendTo($('#test'));

which is not what I'm trying to achieve.

link to test case:
live.datatables.net/cumapapu/3/

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 20,147Questions: 26Answers: 4,736

    Use column().header() to get the th html, like this:
    http://live.datatables.net/cumapapu/5/edit

    Kevin

  • potato_codepotato_code Posts: 14Questions: 5Answers: 0

    Hi,

    Thanks for the reply but that's not what I was hoping to achieve. I was aiming for something like this for example:

    <div>
       <label>Name</label>
       <select>
         <option>Angelica Ramos</option>
         <option>Ashton Cox</option>
         .....
       </select>
    </div>  
    

    where in the Bootstrap Modal there is two columns. The left is labels (ie: Name, Position, Office, etc) and the right column is the dropdown search select. Is this possible?

  • kthorngrenkthorngren Posts: 20,147Questions: 26Answers: 4,736

    Since you are able to get the column data and the header name you will need to refer to the Bootstrap Modal docs to learn how to display the modal the way you want.

    Kevin

  • MoebiusMoebius Posts: 12Questions: 3Answers: 1
    Answer ✓

    Consider the SearchBuilder plugin. It satisfied my requirements in 5 lines of code.

    https://datatables.net/extensions/searchbuilder/examples/initialisation/simple.html

Sign In or Register to comment.