This is the code I have:
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtInsertComments" CssClass="expanding" runat="server" AutoPostBack="false" TextMode="MultiLine"></asp:TextBox>
</div>
<div id="commands">
<table cellpadding="0" cellspacing="0" width="400px" id="tblCommands">
<tr>
<td style="width: 50%; text-align: center;">
<asp:LinkButton ID="lnbInsertRes" runat="server" CommandName="Insert" Font-Underline="false">Insert</asp:LinkButton>
</td>
<td style="width: 50%; text-align: center;">
<asp:LinkButton ID="lnbCancelRes" runat="server" CommandName="Cancel" Font-Underline="false">Cancel</asp:LinkButton>
</td>
</tr>
</table>
</div>
</form>
</body>
<script type="text/javascript">
$(function()
{
$("#commands").hide("normal");
$("textarea[id$=txtInsertComments]").focus(function()
{
$("#commands").show("normal");
});
});
</script>
</html>
First, when this page is loading, the div #command is loaded very quick and then disappears. I need the div to remain hidden until the textbox txtInsertComments control is clicked or gets focus.
Second, when the user click out of the textbox txtInsertComments or that the textbox lost focus, the div #command is still there and not hidden.
Any help is appreciated.