Hi,
When I click on a button it should hide all my 'select' input and when
I click on another button, it should make them visible again. Here's
how I do it :
<div>
<asp:DropDownList ID="ddSearchCriteria" runat="server" />
<input type="button" id="btnSearch" value="Go" />
<input id="btnNewCutting" type="button" value="New" />
<input id="btnEmail" type="button" value="Email" />
<asp:DropDownList ID="ddSortBy" runat="server"
AutoPostBack="true"></asp:DropDownList>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#btnEmail").bind("click", function(e) {
$("select").css("display", "none");
});
$("#btnSearch").bind("click", function(e) {
$("select").css("display", "block");
});
});
</script>
This works, except that when I make them visible again, the layout
changes ! The elements in the div are no longer next to each other.
Now there is the first select, then the 3 buttons underneath, then the
second select underneath the 3 buttons.
Why .css("display", "none") changes the layout ?
