How to handle OnActiveTabChanged event of AJAX Tab control

This Articles explian how to handle ActiveTabChanged Event of AJAX TabControl in asp.net.

ActiveTabIndex="0" BorderStyle="None" Width="742px" BorderWidth="0" OnActiveTabChanged="tbcRatingMaster_ActiveTabChanged"
AutoPostBack="True">


protected void tbcRatingMaster_ActiveTabChanged(object sender, EventArgs e)
{
if (tbcRatingMaster.ActiveTabIndex == 0)
{
//AddGrpBind();
btnSaveRG.Text = "Save";
txtGroup.Text = "";
txtGroup.Text = "";
}
if (tbcRatingMaster.ActiveTabIndex == 1)
{
txtItem.Text = "";
}
if (tbcRatingMaster.ActiveTabIndex == 2)
{
rbtnType.SelectedValue = "P";
gvRating.Visible = false;
txtItem.Text = "";
txtGroup.Text = "";
}
}

Thanks & Regards
Santosh Singh

Read More

AJAX Accordian Example

<ajaxToolkit:Accordion ID="acdContactInfo" runat="server" SelectedIndex="0" FadeTransitions="true"
TransitionDuration="300" HeaderCssClass="accordHeader" ContentCssClass="accordionContent"
HeaderSelectedCssClass="accordHeaderSelected">
<Panes>
<ajaxToolkit:AccordionPane ID="empfirstAdd" runat="server" Width="100%">
<Header>>
First Address </Header>
<Content>
<table>
<tr>
<td colspan="4" style="text-align: left; height: 22px;">
<strong><span style="color: #999999">Present Address Details</span></strong>
</td>
<td style="width: 137px; text-align: left; height: 22px;">
</td>
<td style="text-align: left; height: 22px; width: 10px;">
</td>
<td style="width: 10px; height: 22px; text-align: left">
</td>
<td style="width: 187px; text-align: left; height: 22px;">
</td>
</tr>
<tr>
<td style="width: 204px; text-align: right; vertical-align: middle;" valign="top">
<strong>Address</strong>
</td>
<td style="width: 3px" valign="top">
<span style="color: #ff3333">*</span>
</td>
<td style="width: 3px" valign="top">
:
</td>
<td rowspan="3" style="width: 133px; text-align: left" valign="top">
<asp:TextBox ID="txtFAddress" runat="server" Height="53px" MaxLength="200"
TextMode="MultiLine" Width="200px"></asp:TextBox>
</td>
<td style="width: 137px; text-align: right; vertical-align: middle; height: 19px;"
valign="to">
<strong>Country</strong>
</td>
<td style="width: 10px; text-align: center; vertical-align: middle;" valign="top">
<span style="color: #ff3333">*</span>
</td>
<td style="vertical-align: middle; width: 10px; text-align: center" valign="top">
:
</td>
<td style="width: 187px; text-align: left" valign="top">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="ddlCountry" runat="server" AutoPostBack="True" DataTextField="CountryName"
DataValueField="CountryId" Height="20px" OnSelectedIndexChanged="ddlCountry_SelectedIndexChanged"
Width="144px">
<asp:ListItem Text="<Select Country>" Value="0"></asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
<tr>
<td style="width: 204px; text-align: left" valign="top">
</td>
<td style="width: 3px" valign="top">
</td>
<td style="width: 3px" valign="top">
  
</td>
<td style="width: 137px; text-align: right; vertical-align: middle; height: 19px;"
valign="top">
<strong>State</strong>
</td>
<td style="width: 10px; text-align: center; vertical-align: middle;" valign="top">
<span style="color: #ff3333">*</span>
</td>
<td style="vertical-align: middle; width: 10px; text-align: center" valign="top">
:
</td>
<td style="width: 187px; text-align: left" valign="top">
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:DropDownList ID="ddlState" runat="server" AutoPostBack="True" DataTextField="StateName"
DataValueField="StateId" Height="20px" OnSelectedIndexChanged="ddlState_SelectedIndexChanged"
Width="144px">
<asp:ListItem Text="<Select State>" Value="0"></asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
<tr>
<td style="width: 204px; text-align: left; height: 19px;" valign="top">
</td>
<td style="width: 3px; height: 19px;" valign="top">
</td>
<td style="width: 3px; height: 19px;" valign="top">
  
</td>
<td style="width: 137px; text-align: right; vertical-align: middle; height: 19px;"
valign="top">
<strong>City</strong>
</td>
<td style="width: 10px; text-align: center; vertical-align: middle; height: 19px;"
valign="top">
<span style="color: #ff3333">*</span>
</td>
<td style="vertical-align: middle; width: 10px; height: 19px; text-align: center"
valign="top">
:
</td>
<td style="width: 200px; text-align: left; height: 19px;" valign="top">
<asp:DropDownList ID="ddlCity" runat="server" DataTextField="CityName" DataValueField="CityId"
Height="20px" Width="150px">
</asp:DropDownList>
</td>
</tr>
</table>
</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPane ID="AccPaneEmpSecAdd" runat="server" Width="100%">
<Header>
Second Add</Header>
<Content>
<table>
<tr>
<td align="left" style="width: 204px; height: 16px; vertical-align: middle; text-align: right;">
<strong>Name</strong>
</td>
<td style="height: 16px; width: 2px;">
<span style="color: #ff3333">*</span>
</td>
<td style="width: 3px; height: 16px">
:
</td>
<td style="color: #000000; height: 24px" align="left">
<asp:TextBox ID="txtContName" runat="server" MaxLength="50" Width="188px"></asp:TextBox>
</td>
<td style="height: 19px; text-align: right; vertical-align: middle;">
<strong>Relation</strong>
</td>
<td style="width: 10px; height: 16px; text-align: left">
<span style="color: #ff3333">*</span>
</td>
<td style="width: 10px; height: 16px; text-align: left">
:
</td>
<td align="left" style="color: #000000; height: 24px">
<asp:DropDownList ID="ddlRelation" runat="server" Width="144px" DataTextField="Relation"
DataValueField="RelationId" Height="20px">
</asp:DropDownList>
</td>
<td style="width: 24px">
</td>
</tr>
</table>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>

Thanks & Regards
Santosh

Read More

AJAX

AJAX tab control
Here i describing a simple example how to use tab control in asp.net

.aspx code

< ajaxToolkit:TabPanel ID="tabFirst" runat="server" Width="111px" >
< HeaderTemplate>
First Tab Header name
< /HeaderTemplate>
< ContentTemplate>
< br />
< asp:GridView ID="gvEmpDetail" runat="server" DataKeyNames="EmpId" AllowPaging="True" PageSize="12"
AutoGenerateColumns="False" OnPageIndexChanging="gvEmpDetail_PageIndexChanging"
OnRowDataBound="gvEmpDetail_RowDataBound" TabIndex="2" Width="697px" OnRowCancelingEdit="gvEmpDetail_RowCancelingEdit"
OnRowEditing="gvEmpDetail_RowEditing" OnRowUpdating="gvEmpDetail_RowUpdating"
ShowFooter="True" OnRowCommand="gvEmpDetail_RowCommand" OnRowDeleting="gvEmpDetail_RowDeleting">
< Columns>
< asp:TemplateField HeaderText="Sr. No">
< ItemTemplate>
< asp:Label ID="lblSrNo" runat="server"> </asp:Label>
< /ItemTemplate>
< ItemStyle HorizontalAlign="Center" Width="50px" />
< /asp:TemplateField>
< asp:TemplateField HeaderText="EmpId" Visible="False">
< ItemTemplate>
< asp:Label ID="lblEmpId" runat="server" Text=' <%# Bind("EmpId") %>'> </asp:Label>
< /ItemTemplate>
< FooterTemplate>
< asp:Label ID="lblFooterEmpId" runat="server"> </asp:Label>
< /FooterTemplate>
< /asp:TemplateField>
< asp:TemplateField HeaderText="Emp">
< ItemTemplate>
< asp:Label ID="lblEmp" runat="server" Text=' <%# Bind("Emp") %>'> </asp:Label>
< /ItemTemplate>
< EditItemTemplate>
< asp:TextBox ID="txtEmp" runat="server" Text=' <%# Bind("Emp") %> '> </asp:TextBox>
< /EditItemTemplate>
< FooterTemplate>
< asp:TextBox ID="txtNewEmp" runat="server" Visible="false"> </asp:TextBox>
< /FooterTemplate>
< FooterStyle HorizontalAlign="Left" />
< ItemStyle HorizontalAlign="Left" />
< /asp:TemplateField>
< asp:TemplateField HeaderText="Edit">
< ItemTemplate>
< asp:ImageButton ID="ImgYes" runat="server" ImageUrl="~/Image/img_edit.png" CommandName="Edit" />
< /ItemTemplate>
< EditItemTemplate>
< asp:ImageButton ID="LinkButton1" runat="server" CausesValidation="True" CommandName="Update"
ImageUrl="~/Image/update.png" Text="Update" />
< asp:ImageButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Cancel"
ImageUrl="~/Image/cancel.png" Text="Cancel" />
< /EditItemTemplate>
< FooterTemplate>
< asp:ImageButton ID="ButtonAdd" runat="server" ImageUrl="~/Image/row_add.png" CommandName="AddNew"
ToolTip="Add New" />
< asp:ImageButton ID="lbtnAdd" runat="server" CausesValidation="True" CommandName="Add"
ImageUrl="~/Image/add.png" Visible="false" Text="Add" />
< asp:ImageButton ID="lbtnCancel" runat="server" CausesValidation="False" CommandName="Cancel"
ImageUrl="~/Image/cancel.png" Visible="false" Text="Cancel" />
< /FooterTemplate>
< FooterStyle HorizontalAlign="Center" Width="120px" />
< ItemStyle HorizontalAlign="Center" Width="120px" />
< /asp:TemplateField>
< asp:TemplateField HeaderText="Delete">
< ItemTemplate>
< asp:ImageButton ID="ImgDelete" runat="server" ImageUrl="~/Image/img_delete.png"
CommandName="Delete" OnClientClick="return ConfirmDelete();" />
< /ItemTemplate>
< ItemStyle HorizontalAlign="Center" Width="80px" />
< /asp:TemplateField>
< /Columns>
< /asp:GridView>
< asp:Label ID="exceptionMessage" runat="server" ForeColor="Red" Width="498px"> </asp:Label>
< /ContentTemplate>
< /ajaxToolkit:TabPanel>

< ajaxToolkit:TabPanel ID="tabEmpInfo" runat="server" >
< HeaderTemplate>
Emp Information
< /HeaderTemplate>
< ContentTemplate>
< br />
< asp:GridView ID="gvEmpInfo" runat="server" AllowPaging="True" AutoGenerateColumns="False" PageSize="12"
OnPageIndexChanging="gvEmpInfo_PageIndexChanging" OnRowDataBound="gvEmpInfo_RowDataBound"
TabIndex="2" Width="697px" OnRowCancelingEdit="gvEmpInfo_RowCancelingEdit" OnRowEditing="gvEmpInfo_RowEditing"
OnRowUpdating="gvEmpInfo_RowUpdating" ShowFooter="True" OnRowCommand="gvEmpInfo_RowCommand"
OnRowDeleting="gvEmpInfo_RowDeleting" DataKeyNames="EmpInfoId">
< Columns>
< asp:TemplateField HeaderText="Sr. No">
< ItemTemplate>
< asp:Label ID="lblSrNo" runat="server"> </asp:Label>
< /ItemTemplate>
< ItemStyle HorizontalAlign="Center" Width="50px" />
< /asp:TemplateField>
< /Columns>
< /asp:GridView>
< asp:Label ID="exceptionEmpInfo" runat="server" ForeColor="Red" Width="498px"> 0)
{
gvEmpDetail.DataSource = Ds;
gvEmpDetail.DataBind();
}
else
{
ShowNoResultFound(Ds.Tables[0], gvEmpDetail);
}
}
catch (Exception ex)
{
exceptionMessage.Text = ex.Message;
}
}
protected void GridViewEmpInfo()
{
try
{
Ds = objEmpInfoBLL.GetEmpInfoData();
if (Ds.Tables[0].Rows.Count > 0)
{
gvEmpInfo.DataSource = Ds;
gvEmpInfo.DataBind();
}
else
{
ShowNoResultFound(Ds.Tables[0], gvEmpInfo);
}
}
catch (Exception ex)
{
exceptionEmpInfo.Text = ex.Message;
}
}

Thanks & Regards
Santosh Singh

Read More