topic Re: HTML expand attribute table from bottom in ArcGIS JavaScript Maps SDK Questions

HTML expand attribute table from bottom

AlexGole — Fri, 13 Nov 2015 22:16:50 GMT

Hi all,

I am trying to create a div (attribute table) that would expand from the bottom and collapse just like in WebAppBuilder. My problem is that my div is hiding behind the map. Any ideas how I can get it to push the map up without loosing the current extent.

Web app Builder (what Id like to achieve)

Attached is my html code

Re: HTML expand attribute table from bottom

RobertScheitlin__GISP — Sat, 14 Nov 2015 20:45:07 GMT

Alex,

Your whole head section is missing (no style, css, or script). Hard to do anything with this. Hve you tried adjust the z-index of the div?

Re: HTML expand attribute table from bottom

AlexGole — Mon, 16 Nov 2015 21:05:26 GMT

Robert, I was only able to toggle the size of the map so far (although the scalebar is acting weird when toggled, It is going when the height reduces 70% it works fine but I go back to 100% seems like the scale bar goes first) . Here is my code. I am not yet able to toggle the attribute table

toggle map size:

$("#attribute").on('click', function () {

var state = $(this).data('state');

if (state) {

$("#map").animate({ height: '100%'}, 800);

state = false;

} else {

$("#map").animate({ height:'70%'});

state = true;

}

$(this).text(state ? 'Open' : 'Close').data('state', state);

});

Now I still need to find a way to toggle the table the same way as the map. Not too sure how to make that happen yet. Any help is welcome

</div>

Re: HTML expand attribute table from bottom

RobertScheitlin__GISP — Tue, 17 Nov 2015 15:09:15 GMT

Alex,

I have edited your JSBin to work now for toggling the table and resizing the map properly:

JS Bin - Collaborative JavaScript Debugging

Re: HTML expand attribute table from bottom

AlexGole — Tue, 17 Nov 2015 16:40:25 GMT

That is it! Thank you!