Integrating jQuery UI range slider with DataTables

Integrating jQuery UI range slider with DataTables

CompeAnansiCompeAnansi Posts: 1Questions: 1Answers: 0

I've been trying to figure things out on my own so I started with an example templates for range searches: https://www.datatables.net/examples/plug-ins/range_filtering.html

However, instead of using two text boxes I want to use a slider with two moveable parts. I found that jQuery UI has a nice slider that I could use so I've settled on that. I've gotten everything hashed out to the point that the slider shows up properly as does the table, but the slider has no effect on the table whatsoever. Here is the test version on DataTables live that I'm working with: http://live.datatables.net/lujupuji/1/edit

Any suggestions on fixing the code would be greatly appreciated as I have hit a wall and can't think of anything else to tweak.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,759Questions: 1Answers: 10,510 Site admin
    Answer ✓

    hi,

    If you have a look in the debug control in your browser for the example you gave (thanks for that btw!) - you'll see two Javascript errors being reported:

    • Uncaught TypeError: val_range.slider is not a function
    • Uncaught TypeError: Cannot read property 'fnDraw' of undefined

    The first is because val_range is not available in the scope of the search function and the second is because draw() should be used, rather than the legacy fnDraw method.

    This fixes both and allows the slider to work: http://live.datatables.net/lujupuji/2/edit . You'd done all the hard work already :-).

    Allan

This discussion has been closed.