Had a search on forum but couldn't find anything relating to showing and hiding tables. Basically what we are trying to do it make a tables contents show up if you click a button, and then once you click the button it'd be nice to give the option to hide again.
We have gotten partway through testing in JS fiddle but the problem is once its switched to JQuery 2x (edge) the button just disappears! Is there an easier/better way to do the code than how we've been trying!
We've used something like this in the javascript to make the button appear but not sure why it doesnt work in the edge jquery!
$("#myButton").toggle(function(){
$("#content").slideDown();
$(this).val("Slide up ↑");
},function(){
$("#content").slideUp();
$(this).val("Slide down ↓")
}
Hopefully someone can shed some light, thanks heaps.
The biggest issue we have faced is the button disappearing altogether when the JQuery is switched to anything above 1.8. (edited) Is it easier to just have 2 buttons, i.e an expand or collapse? Thanks mate.
The biggest issue we have faced is the button disappearing altogether when the JQuery is switched to anything above 1.8. (edited) Is it easier to just have 2 buttons, i.e an expand or collapse? Thanks mate.
So, the .toggle() function that you are trying was deprecated in jQuery 1.7, and no longer works that way. So, you could do something like this:
$('#myButton').click(function() {
var c = $('#content');
var b = $(this);
if (c.hasClass('toggled')) {
c.slideUp().removeClass('toggled');
b.val("Slide down ↓");
} else {
c.slideDown().addClass('toggled');
b.val("Slide up ↑");
}
});