How to move search box to another place in the page? JSFiddle included.

How to move search box to another place in the page? JSFiddle included.

DanielFragaBRDanielFragaBR Posts: 4Questions: 1Answers: 0
edited June 2014 in Free community support

I googled a lot before asking this and I noticed this is a frequent doubt.

How can I move the search box to another place in the page? I want to put it inside the Bootstrap navbar just like was asked here:

http://stackoverflow.com/questions/23724076/how-to-customize-bootstrap-datatable-search-box-and-records-view-position

So is there a simple way? Thanks.

Ps: I update this post with a fiddle to better illustrate the problem.

http://jsfiddle.net/DanielFragaBR/ALNvR/

This question has an accepted answers - jump to answer

Answers

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14

    The simplest way would be to make your own search, hook it up, and turn off the one that already exists. Either that or I'm fairly certain you could move it around in the dom using Jquery (Although I've never tried so I may be wrong). You can move the search bar around inside of the dataTables_wrapper by changing where inside the 'dom' argument is, beyond that I don't think there is a way of moving it.

  • DanielFragaBRDanielFragaBR Posts: 4Questions: 1Answers: 0

    Hi! I did a fiddle to illustrate better. The same search box that works outside Bootstrap container will not work inside the container:

    http://jsfiddle.net/DanielFragaBR/ALNvR/

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14
    Answer ✓

    You can't have multiple items with the same ID. Jquery will only return the first item that matches, so since you had 3 items with all the same Id it found the first one to work and returned it. If you rename them to be Searchbox 1, 2 and 3 than the filter will work with all 3 of them (after changing the selector obviously).

  • DanielFragaBRDanielFragaBR Posts: 4Questions: 1Answers: 0

    Rpiechura thank you very much! Excellent answer! ;)

This discussion has been closed.