slideToggle() : problem with toggle state
Hi,
I want to just replace text in <span> on another div's slideToggle(), I have written some code which I expect to execute, but it's not working.
In slideToggle() function I am getting false from is(:hidden) on both the State of slideToggle
Following is my html code:
- <div style="width:77%; float:left;">
- <span id="addareas" class="OtherLinkStyle" style="font-size:14px;">
- Show apartment area details
- </span>
- </div>
<div class="RoundPanel" style="float:left; width:77%;margin: 5px 0 0 0;position:relative;display:none;">
- <div id="ApartmentAreaDetails" style="width: 99%; float: left; padding-left: 10px;">
- //some content here
- </div>
<div style="display:none; position:absolute; bottom:5px; right:5px;" class="btnsave">
<input type="submit" value="Save" name="btnSave" class="linkSave"/>
<input type="submit" value="Cancel" name="btnCancel" class="linkCancel"/>
</div>
</div>
and following is my jquery code:
- $('#addareas').click(function () {
$(this).parent().next(".RoundPanel").slideToggle('fast');
if ($(this).parent().next(".RoundPanel").is(":hidden") == true) {
$(this).html('Show apartments area details');
}
else {
$(this).html('Hide apartments area details');
}
});
Is I am doing anything wrong or missing anything here?