Hello Guys ,
I have 2 queries.
First of all on my page load , my nodes is having maximum height of 100 , irrespective of how much data it contain , what all data can be shown in height 100 , it can be shown , after 90 height , it should show load more button (so 1 concerns- how to place load more button in bottom of node always ) with in 100 height what ever data is shown with in that height , Load More is must .
it have more data in response , but somehow , after 100px data should not be shown and load more button in place
Again when you click on load more , the height should increase to 500px with more data showing and instead of load more , it should be collapse button , again on bottom of node(position of the collapse button should be bottom of node)
Am not sure how to achieve this ? if you guys can help me on the same , will be helpful
So main queries are
- how to place load more button on bottom of node
- on clicking load more button , height of node increase to show all data+ load more button to be replace with collapse button
- collapse button on bottom of node
$(
go.Node,
'Auto',
$(go.Shape, { fill: 'white', name: 'SHAPE', maxSize: new go.Size(100, 100) }),
$(
go.Panel,
'Vertical',
//description data
),
$(
go.Panel,
'Table',
new go.Binding('itemArray', 'mylist'),
{
itemTemplate: $(
go.Panel,
'TableRow',
$(
go.TextBlock,
new go.Binding('text', 'name')
),
$(
go.TextBlock,
new go.Binding('text', 'grade')
),
)}
),
)
on page load its 100 height and on click on load more button , height increases to 500 and show all data.
Help me with
- How to place buttons
- On click on load more , it should change to collapse button
- height increases from 100 to 500 on click