I'm trying to fire a function on a selected tab.
<script>
$(document).ready(function () {
$("#tabs").tabs({
show: function() {
var selectedTab = $('#tabs').tabs('option', 'selected');
$("#<%= hdnSelectedTab.ClientID %>").val(selectedTab);
},
selected: <%= hdnSelectedTab.Value %>
});
$("#g_view").click(function()
{
alert("tab 2 selected");
});
});
</script>
<div id="tabs">
<ul>
<li><a href="#add_usr">Entry</a></li>
<li><a href="#g_view">DataBase</a></li>
</ul>
<div id="g_view">
<asp:TextBox ID="gv_textb" runat="server"></asp:TextBox>
<asp:GridView ID="GridView1" runat="server">
</asp:GridView>
</div>
</div>
When I click on the DataBase tab, the function doesn't fire, but it fires up when I click on the content inside the DataBase tab.
Is there anyway to fire it on the tab click not the contents inside the tab?