Individual column searching select & text inputs

Individual column searching select & text inputs

Rich_WalkerRich_Walker Posts: 9Questions: 3Answers: 0

Hi

I am looking to have some columns have select inputs and the rest have text inputs. I haven't been able find any examples. Is it possible to do this?

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 16,790Questions: 25Answers: 3,979

    Here are examples of each:
    https://datatables.net/examples/api/multi_filter.html

    https://datatables.net/examples/api/multi_filter_select.html

    One option is to add a class to the columns that indicate the type of search you want then in the columns().every() loop you can use a selector as described in the columns() docs to choose which columns to apply the search input or drop down.

    Kevin

  • Rich_WalkerRich_Walker Posts: 9Questions: 3Answers: 0

    Thanks Kevin

    I am really struggling to work out how put a select field in column 1 only and leave input fields for the rest. Here is what i have already. http://live.datatables.net/jomoruma/4/edit

    Thanks
    Rich

  • Rich_WalkerRich_Walker Posts: 9Questions: 3Answers: 0

    Ok, i'm a little closer. http://live.datatables.net/jomoruma/6/edit

    Just can't get it show in the correct row. Its showing on the row above the input.

  • kthorngrenkthorngren Posts: 16,790Questions: 25Answers: 3,979
    Answer ✓

    Great, thanks for the example. Made a couple changes and it seems to work better:
    http://live.datatables.net/pekarebe/1/edit

    Changes:
    1. Added "B" to a few rows of column 0 for testing
    2. Add class ".text-input" to the 2nd footer columns with input searches
    3. Changed the loop to create the inputs to this: $('#example tfoot tr.cus-footer th.text-input').each( function () - added the class
    4. Changed the code to "apply the search"

    Hope this helps.

    Kevin

  • madrianmadrian Posts: 6Questions: 1Answers: 0

    It is possible to populate the selector with all data from table? Currently it's populated only with displayed results. I am using server side pipelined method.

  • kthorngrenkthorngren Posts: 16,790Questions: 25Answers: 3,979
    edited January 2020

    @madrian Your server script will need to build the options and return it in an Ajax response. When Datatables initializes a server side table the first Ajax request has draw parameter of 1. Your server script can look at the draw parameter and if 1 then it can build the options and return them as part of the initial Ajax response. You can then access the JSON response in the initComplete function.

    Kevin

This discussion has been closed.