user558134
user558134

Reputation: 1129

Jquery - toggle problem

I have this toggle function

$('#togglebtn').toggle(function() {
 $('#panel').show();
}, function() {
 $('#panel').hide();
});

I also have another button to close/hide the panel

$('#otherbtn').click(function() {
 $('#panel').hide();
});

All I am trying to say is that when I hide the panel with #otherbtn the event is still active on #togglebtn and gives me an extra click to start toggle the panel again. How can I fix that?

Upvotes: 0

Views: 1269

Answers (3)

Ivan Ivanic
Ivan Ivanic

Reputation: 3054

Trigger click event on toggle button.

$('#otherbtn').click(function() {
 $('#panel').hide();
 $('#togglebtn').click(); //resets tooglebtn state
});

Upvotes: 0

Felix Kling
Felix Kling

Reputation: 816424

What you want to do is already available via the other .toggle() function. Just bind it to the click event:

$('#togglebtn').click(function() {
    $('#panel').toggle()
});

(instead of $('#togglebtn').toggle(...) )

Upvotes: 5

DhruvPathak
DhruvPathak

Reputation: 43235

$('#otherbtn').click(function() {
 $('#panel').hide();
$('#togglebtn').toggle(function() {
 $('#panel').hide();
}, function() {
 $('#panel').show();
});

});

Should work. Reversed the toggle behaviour of the 'otherbtn'

Upvotes: 0

Related Questions