Link to home
Avatar of Jazzy 1012
Jazzy 1012

asked on

Collapse in/out from a "a href" each row containing different id

I have this code:
                                      <tr>
					        <td>May 5th. 2017</td>
					        <td>#2134</td>
					        <td>Delivered</td>
					        <td>$30.67</td>
					        <td><a class="orange" style="text-decoration:underline" id="details_id" href="#">Details</a></td>
					      </tr>
					      <tr>
						<div id="details_id">
						<span>HERE WILL BE ALOT OF INFORMATION FOR EACH DAY</span>
						</div>
					      </tr>

Open in new window


And I want the div that has the "details_id" to be collapse in (hidden) until user clicks on "Details" which contains the same id. I need this to work with alot of rows that would have a unique details_394 because later I will be pulling these rows from a database so if there is 10 rows, which ever details i will click on will collapse out to show the compatible information. And when I click details again it should collapse in (hide).
ASKER CERTIFIED SOLUTION
Avatar of Michel Plungjan
Michel Plungjan
Flag of Denmark image

Blurred text
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
Avatar of Jazzy 1012
Jazzy 1012

ASKER

Okay but can I do it if each have a unique attr for example
meal_2349035
so that when I click the details that has that attr. , it will expand the one with that attr as the same as it.
SOLUTION
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
Yes You can use data attributes as shown by Julian, but if the link is in a row next to the details then it is not necessary as I have shown
My initial response was identical to Michel's - I only posted the alternative as there was a specific request for activating on attribute.

Michel's solution is the main one though - mine was just an extension.