Hideable Table Row using Angular JS

Question

How to achieve a hideable Table Row in Angular JS ?

I need to display a Database Table A , and on click of Table A's record , it shows a one to many mapping from Table B [going by A's Primary IDN] . Table B has many records for each record in A . I tried various approaches but none works . For example Table inside Table won't work . Div inside Div has issue with margins . Is there an existing approach for this ? I am looking for a collapsible table attached to a main table . I find ng-repeat to have some limitations as it won't loop outside of the element which is handy in these cases .

Record 1 Date Name(-)  //To show its collapsed
   Record1's Book1 Name Author
   Record1's Book2 Name Author
Record 2 Date Name(+)  //Uncollapsed

http://www.javascripttoolbox.com/jquery/ has a good demo of the feature I am looking for .

ckruszynsky · Accepted Answer · 2014-05-28 20:31:51Z

2

Here's an example that I wrote that your looking for : http://plnkr.co/edit/IQ6uSmDKMzw0G3g425PI?p=preview

answered May 28, 2014 at 20:31

ckruszynsky

5333 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Nishant Over a year ago

Thanks was not aware of the if logic in Angular . Will have a look . Also I need the inner content to be a table too like the outer one ! A bit like : jsfiddle.net/nishantvarma/98SGz

Nishant Over a year ago

ng-repeat-start and ng-repeat-end is what was missing from my understanding ! I Wasn't aware it can stretch across tags .

Collectives™ on Stack Overflow

Hideable Table Row using Angular JS

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related