antivinegar antivinegar - 1 year ago 41
HTML Question

How to get two results with one button using CSS & Jquery

Ok what I'm trying to accomplish is once someone clicks a button at the top we'll say the "Pagado" button I would like this to also display the "Pendiente" results as well whereas we'll say they are related and I want them both to be displayed.

See image below as the example:
This is what the page would look like and the buttons at the top would allow you to sort/filter the results

Below is what the outcome I'm trying to create... Once the "Pagado" button is pressed only the results with the "Pagado" mention would be displayed on the page.
This is what I would like to function once a button was selected this results would be displayed.

Here is the code for the example...

How to show

at the same time?

Answer Source

Just use a combined data-status in your html something like:

<tr data-status="pagado_pendiente"> where the row has both status say (Pagado) and (Pendiente)

and in your JS instead of matching the exact string look for contains something like:

$('.table tr[data-status*="' + $target + '"]').fadeIn('slow'); instead of $('.table tr[data-status="' + $target + '"]').fadeIn('slow');