We help IT Professionals succeed at work.

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

Jazzy 1012
Jazzy 1012 asked
on
142 Views
Last Modified: 2017-04-21
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).
Comment
Watch Question

IT Expert
CERTIFIED EXPERT
Top Expert 2009
Commented:
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION

Author

Commented:
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.
CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019
Commented:
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION
Michel PlungjanIT Expert
CERTIFIED EXPERT
Top Expert 2009

Commented:
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
CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
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.

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a sample view!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.