Develop Reference

ImageButton in GridView TemplateField wont show AJAX Popup Modal

I have a page that displays a GridView containing an ImageButton TemplateField. My goal is to display an AJAX modal popup when one of those buttons are clicked, along with displaying the row where the button is pressed. The problem is that when I click on a button, it does not show the modal popup. I tried to use this tutorial and read several articles on this site about this issue but to no avail. How to properly fire the button event and show the popup?
Here is the snippet for the gridview:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
Width="505px" DataSourceID="SqlDataSource1">
<Columns>
<asp:BoundField DataField="ItemDesc"
SortExpression="ItemDesc" ItemStyle-Width="100px" ItemStyle-Height="100px">
<ItemStyle Height="100px" Width="100px"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Price" SortExpression="Price"
ItemStyle-Width="100px" ItemStyle-Height="100px">
<ItemStyle Height="100px" Width="100px"></ItemStyle>
</asp:BoundField>
<asp:TemplateField>
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Image ID="Image1" runat="server" Height="200px"
ImageUrl='<%# Eval("ImagePath") %>' Width="200px" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:ImageButton ID="ImageButton1" runat="server" CommandName="atc" ImageUrl="~/App_Themes/img/shop/addtocart.png"
Text="Add to Cart" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>"/>
</ItemTemplate>
<ControlStyle Height="30px" Width="105px" />
<ItemStyle Width="105px" />
</asp:TemplateField>
</Columns>
</asp:GridView>
...
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="HiddenField1" PopupControlID="Panel1" BackgroundCssClass="modalBg" CancelControlID="btnClose">
</asp:ModalPopupExtender>
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Panel ID="Panel1" runat="server" Width="500" Height="500" Visible="False"
style="background-color:#6f95f4; color:#000000;">
<div class="style1">
<br />
<br />
<br />
<br />
<br />
<table style="width: 90%; height: 71px;">
<tr>
<td>
Item Name</td>
<td>
<asp:Label ID="lblItemName" runat="server" Text="Label"></asp:Label>
</td>
</tr>
<tr>
<td>
Price</td>
<td>
<asp:Label ID="lblPrice" runat="server" Text="Label"></asp:Label>
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
<tr>
<td>
Quantity</td>
<td>
<asp:TextBox ID="TextBox2" runat="server" Type="Number" Min="1" MaxLength="100"
Width="75px" Height="23px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
Total Price</td>
<td>
<asp:Label ID="lblTotalPrice" runat="server" Text="Label"></asp:Label>
</td>
</tr>
</table>
<br />
<br />
<asp:Button ID="btnAddToCart" runat="server" Text="Add to Cart"
onclick="btnAddToCart_Click" />
<br />
<br />
<asp:Button ID="btnClose" runat="server" onclick="btnClose_Click" Text="Close"
Width="199px" />
</div>
</asp:Panel>
And here's my code for the event:
protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName.Equals("atc"))
{
ModalPopupExtender1.Show();
//// Retrieve the row index stored in the
//// CommandArgument property.
int index = Convert.ToInt32(e.CommandArgument);
//// Retrieve the row that contains the button
//// from the Rows collection.
GridViewRow row = GridView1.Rows[index];
lblItemName.Text = row.Cells[0].Text;
lblPrice.Text = row.Cells[1].Text;
Response.Write("<script>alert('" + row.Cells[0].Text + "\n" + row.Cells[1].Text + "');</script>");
//// Add code here to add the item to the shopping cart.
}
}
EDIT: Added the panel code.

Try like this:
100% working and Tested
Use onrowcommand="GridView1_RowCommand" for GridView
Use display:none for Your Panel instead of Visible="false"
I Commented your alert(in rowbound) it contains js error
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" Width="505px"
onrowcommand="GridView1_RowCommand"
>
<Columns>
<asp:BoundField DataField="ItemDesc" SortExpression="ItemDesc" ItemStyle-Width="100px"
ItemStyle-Height="100px">
<ItemStyle Height="100px" Width="100px"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Price" SortExpression="Price" ItemStyle-Width="100px"
ItemStyle-Height="100px">
<ItemStyle Height="100px" Width="100px"></ItemStyle>
</asp:BoundField>
<asp:TemplateField>
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Image ID="Image1" runat="server" Height="200px" ImageUrl='<%# Eval("ImagePath") %>'
Width="200px" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:ImageButton ID="ImageButton1" runat="server" CommandName="atc"
CausesValidation="false"
Text="Add to Cart" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" />
</ItemTemplate>
<ControlStyle Height="30px" Width="105px" />
<ItemStyle Width="105px" />
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<ajax:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Panel1"
PopupControlID="Panel1" OnOkScript="okClick();"
OnCancelScript="cancelClick();"
OkControlID="btnAddToCart" CancelControlID="btnClose">
</ajax:ModalPopupExtender>
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:Panel ID="Panel1" runat="server" Width="500" Height="500"
style="background-color:#6f95f4; color:#000000;display:none">
<div class="style1">
<br />
<br />
<br />
<br />
<br />
<table style="width: 90%; height: 71px;">
<tr>
<td>
Item Name</td>
<td>
<asp:Label ID="lblItemName" runat="server" Text="Label"></asp:Label>
</td>
</tr>
<tr>
<td>
Price</td>
<td>
<asp:Label ID="lblPrice" runat="server" Text="Label"></asp:Label>
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
<tr>
<td>
Quantity</td>
<td>
<asp:TextBox ID="TextBox2" runat="server" Type="Number" Min="1" MaxLength="100"
Width="75px" Height="23px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
Total Price</td>
<td>
<asp:Label ID="lblTotalPrice" runat="server" Text="Label"></asp:Label>
</td>
</tr>
</table>
<br />
<br />
<asp:Button ID="btnAddToCart" runat="server" Text="Add to Cart"
onclick="btnAddToCart_Click" />
<br />
<br />
<asp:Button ID="btnClose" runat="server" onclick="btnClose_Click" Text="Close"
Width="199px" />
</div>
</asp:Panel>
protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName.Equals("atc"))
{
ModalPopupExtender1.Show();
int index = Convert.ToInt32(e.CommandArgument);
GridViewRow row = GridView1.Rows[index];
ImageButton ImageButton1=(ImageButton)row.FindControl("ImageButton1");
// Response.Write("<script>alert('" + row.Cells[0].Text + "\n" + row.Cells[1].Text + "');</script>"); comment this
}

You didn't set OnRowCommand property of the GridView, so GridView1_RowCommand method won't be fired when you click the image button. Here's how you do it
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
Width="505px" DataSourceID="SqlDataSource1"
OnRowCommand="GridView1_RowCommand">
See here for more details.

TextBox in the RadGrid control doesn't make partial postback and fills the other controls

I have a TextBox (named as txt_lect_in) in RadGrid and I handled the TextBox changed event so it fills other textboxes (gv_txt_name,gv_txt_mobile,gv_txt_address,gv_txt_email) in the same grid.
The problem is:
The TextBox (txt_lect_in) doesn't fills the other textboxes, I know the reason but I don't know how to fix it.
After I remove the RadAjaxManager, it fills the other textboxes in the grid but it does full post back, how to keep the ajax manager and fill the controls at the same time?
<telerik:radajaxmanager id="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="gv_about">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="gv_about" LoadingPanelID="RadAjaxLoadingPanel1">
</telerik:AjaxUpdatedControl>
<telerik:AjaxUpdatedControl ControlID="divMsgs"></telerik:AjaxUpdatedControl>
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:radajaxmanager>
<telerik:radajaxloadingpanel id="RadAjaxLoadingPanel1" runat="server">
</telerik:radajaxloadingpanel>
<telerik:radgrid id="gv_about" runat="server" cssclass="RadGrid" allowpaging="True"
pagesize="20" allowsorting="True" autogeneratecolumns="False" showstatusbar="True"
allowautomaticdeletes="True" allowautomaticinserts="True" allowautomaticupdates="True"
datasourceid="ObjectDataSource1" onitemdeleted="gv_about_ItemDeleted" oniteminserted="gv_about_ItemInserted"
onitemupdated="gv_about_ItemUpdated" onitemcommand="gv_about_ItemCommand" onprerender="gv_about_PreRender"
onitemcreated="gv_about_ItemCreated">
<MasterTableView CommandItemDisplay="Top" DataSourceID="ObjectDataSource1">
<commanditemsettings addnewrecordtext="اضافة" showrefreshbutton="False" />
<Columns>
<telerik:GridEditCommandColumn>
</telerik:GridEditCommandColumn>
<telerik:GridBoundColumn UniqueName="emp_num" HeaderText="رقم المحاضر" DataField="emp_num">
<HeaderStyle ForeColor="Silver" Width="25px"></HeaderStyle>
<ItemStyle ForeColor="Gray"></ItemStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="name" HeaderText="الاسم" DataField="name">
<HeaderStyle Width="220px"></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="degree_name" HeaderText="الدرجة العلمية" DataField="degree_name">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="college" HeaderText="الكلية والجامعة" DataField="college">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="type" HeaderText="نوع المحاضر" DataField="type">
</telerik:GridBoundColumn>
<telerik:GridButtonColumn CommandName="Delete" Text="حذف" UniqueName="column">
</telerik:GridButtonColumn>
</Columns>
<EditFormSettings EditFormType="Template">
<EditColumn UniqueName="EditCommandColumn1" FilterControlAltText="Filter EditCommandColumn1 column"></EditColumn>
<FormTemplate>
<table id="Table2" cellspacing="2" cellpadding="1" width="100%" border="0" rules="none"
style="border-collapse: collapse;" >
<tr class="EditFormHeader">
<td colspan="2" style="font-size: small">
<b>استمارة تعارف</b>
</td>
</tr>
<tr>
<td>
<table id="Table3" cellspacing="1" cellpadding="1" width="250" border="0" class="module">
<tr>
<td>
نوع المحاضر:
</td>
<td>
<div id="div_lect_type">
<asp:RadioButtonList ID="rbt_lect_type" runat="server" AppendDataBoundItems="true"
AutoPostBack="true" CausesValidation="false" RepeatDirection="Horizontal" OnSelectedIndexChanged="rbt_lect_type_SelectedIndexChanged">
<asp:ListItem Value="1" Text="معين" Selected="True"></asp:ListItem>
<asp:ListItem Value="2" Text="منتدب خارجي"></asp:ListItem>
<asp:ListItem Value="3" Text="جديد"></asp:ListItem>
</asp:RadioButtonList>
</div>
<div id="div_lect">
<asp:TextBox ID="txt_lect_in" runat="server" AutoPostBack="True" OnTextChanged="txt_lect_in_TextChanged"></asp:TextBox>
<asp:AutoCompleteExtender ID="txt_lect_in_AutoCompleteExtender" runat="server" DelimiterCharacters=""
Enabled="True" MinimumPrefixLength="4" ServiceMethod="Get_Emp_AutoComplete" ServicePath="~/LectIn.asmx"
TargetControlID="txt_lect_in" BehaviorID="ACE_txt_lect_in" CompletionListCssClass="autocomplete_completionListElement"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" CompletionListItemCssClass="autocomplete_listItem"
EnableCaching="False">
</asp:AutoCompleteExtender>
</div>
</td>
</tr>
<tr>
<td>
الاسم:
</td>
<td>
<asp:TextBox ID="gv_txt_name" runat="server" Text='<%# Eval("name") %>' TabIndex="1">
</asp:TextBox>
</td>
</tr>
<tr>
<td>
الموبايل:
</td>
<td>
<telerik:RadMaskedTextBox ID="gv_txt_mobile" runat="server" SelectionOnFocus="SelectAll"
Text='<%# Bind("tel_num") %>' PromptChar="_" Width="300px" Mask="(###)_########"
TabIndex="2">
</telerik:RadMaskedTextBox>
</td>
</tr>
<tr>
<td>
عنوان المراسلات:
</td>
<td>
<asp:TextBox ID="gv_txt_address" runat="server" Text='<%# Eval("address") %>' TabIndex="3">
</asp:TextBox>
</td>
</tr>
<tr>
<td>
البريد الإلكتروني:
</td>
<td>
<asp:TextBox ID="gv_txt_email" runat="server" Text='<%# Eval("email") %>' TabIndex="4">
</asp:TextBox>
</td>
</tr>
<tr>
<td>
الدرجة العلمية:
</td>
<td>
<asp:TextBox ID="gv_txt_degree" runat="server" Text='<%# Eval("degree_name") %>' TabIndex="5">
</asp:TextBox>
</td>
</tr>
<tr>
<td>
الكلية والجامعة:
</td>
<td>
<%-- <asp:TextBox ID="gv_txt_college" runat="server" Text='<%# Eval("college") %>' TabIndex="6">
</asp:TextBox>--%>
</td>
</tr>
</table>
</td>
<td>
</td>
</tr>
<tr>
<td align="right" colspan="2">
<asp:Button ID="btnUpdate" Text='<%# (Container is GridEditFormInsertItem) ? "Insert" : "Update" %>'
runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'>
</asp:Button>
<asp:Button ID="btnCancel" Text="Cancel" runat="server" CausesValidation="False"
CommandName="Cancel"></asp:Button>
</td>
</tr>
</table>
</FormTemplate>
</EditFormSettings>
</MasterTableView>
<ClientSettings>
<ClientEvents OnRowDblClick="RowDblClick"></ClientEvents>
</ClientSettings>
</telerik:radgrid>

Can't display male/female for gender in gridview

I have a data field "Gender" (sql data type - bit).
I have created bound the data with if condition to check true-> male otherwise -> female. But it still does not display.
Here is the aspx and code behind code:The gridview shows true/false instead of male/female:
<%# Page Title="Add User" Language="C#" AutoEventWireup="true" CodeFile="adduser.aspx.cs" Inherits="_Default" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<link href="style.css" type="text/css" rel="Stylesheet" />
<script type="text/javascript">
function confirmDelete() {
return confirm("Do you want to delete this record?");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ajax:ToolkitScriptManager ID="toolkit1" runat="server">
</ajax:ToolkitScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<table border="0" align="center" cellpadding="2" cellspacing="2" class="maindiv">
<tr><!--Hidden field for EmployeeID reference-->
<td colspan="2"><asp:HiddenField ID="txtHiddenEmpID" Value="0" runat="server" /></td>
</tr>
<tr>
<td>
<span class="asterisk">*</span><asp:Label ID="name" runat="server" Text="Name"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtEmpName" runat="server" CssClass="box"></asp:TextBox>
<asp:RequiredFieldValidator Display="None" ID="RequiredFieldValidator1" ErrorMessage="Name is required!"
EnableClientScript="true" SetFocusOnError="true" runat="server" ControlToValidate="txtEmpName"
CssClass="error_msg"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="NameValidator" runat="server" ErrorMessage="Name can not contain numeric or special characters."
ControlToValidate="txtEmpName" ValidationExpression="^[A-Za-z ]*$" CssClass="error_msg"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td>
<span class="asterisk">*</span><asp:Label ID="Label1" runat="server" Text="Address"></asp:Label>
</td>
<td>
<asp:TextBox ID="addressBox" runat="server" CssClass="box"></asp:TextBox>
<asp:RequiredFieldValidator Display="None" ID="AddressValidator" ErrorMessage="Address is required!"
EnableClientScript="true" SetFocusOnError="true" runat="server" ControlToValidate="addressBox"
CssClass="error_msg"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<span class="asterisk">*</span><asp:Label ID="Label2" runat="server" Text="DOB"></asp:Label>
</td>
<td>
<asp:TextBox ID="dobBox" runat="server" CssClass="dob_cal box" ReadOnly="false" ></asp:TextBox>
<ajax:CalendarExtender ID="CalenderExtender1" TargetControlID="dobBox" Format="dd/MM/yyyy"
runat="server">
</ajax:CalendarExtender>
<asp:RequiredFieldValidator Display="None" ID="dobValidator" ErrorMessage="DOB is required!"
EnableClientScript="true" SetFocusOnError="true" runat="server" ControlToValidate="dobBox"
CssClass="error_msg"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<span class="asterisk">*</span><asp:Label ID="Label3" runat="server" Text="Salary"></asp:Label>
</td>
<td>
<asp:TextBox ID="salaryBox" runat="server" CssClass="box" MaxLength="8" ></asp:TextBox>
<asp:RequiredFieldValidator ID="salaryValidate" runat="server" ControlToValidate="salaryBox"
ErrorMessage="Salary is required!" Display="None" CssClass="error_msg" SetFocusOnError="true"
EnableClientScript="true"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="SalaryValidator" runat="server" ErrorMessage="Salary can contain only numeric values."
Display="None" ControlToValidate="salaryBox" ValidationExpression="^[0-9]*$"
CssClass="error_msg"></asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td>
<span class="asterisk">*</span><asp:Label ID="gender" runat="server" Text="Gender"></asp:Label>
</td>
<td>
<span>
<asp:RadioButton GroupName="gendergrp" ID="gendermale" runat="server" Text="Male"
Checked="true" /></span><span style="padding-left: 5px;">
<asp:RadioButton GroupName="gendergrp" ID="genderfemale" runat="server" Text="Female"
Checked="false" /></span>
</td>
</tr>
<tr>
<td>
<div style="float: right; margin-right: -70px;">
<asp:Button ID="Button1" runat="server" CssClass="btn" Text="Save" OnClick="Button1_Click" /></div>
</td>
<td>
<div style="float: left; margin-left: 70px;">
<asp:Button ID="CancelBtn" CausesValidation="false" runat="server" CssClass="btn"
Text="Cancel" OnClick="CancelBtn_Click" />
</div>
</td>
</tr>
<tr>
<td colspan="2">
<asp:Label ID="lblError" runat="server" CssClass="error_msg"></asp:Label>
</td>
</tr>
<tr>
<td colspan="2">
<asp:ValidationSummary ID="valSum" DisplayMode="BulletList" EnableClientScript="true"
HeaderText="Error!" runat="server" CssClass="error_msg" />
</td>
</tr>
</table>
<!--div for data display-->
<div class="data_display">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
DataKeyNames="EmployeeID" EmptyDataText="There are no data records to display."
GridLines="Horizontal" BackColor="#CCCCCC" BorderColor="White" Font-Bold="False"
Font-Names="Arial" Font-Size="Medium" ForeColor="#666666"
AllowPaging="True" PageSize="5" PagerSettings-Mode="Numeric"
PagerSettings-Position="Bottom"
onpageindexchanging="GridView1_PageIndexChanging"
>
<Columns>
<%-- <asp:TemplateField>
<ItemTemplate>
<asp:HiddenField ID="EmpID" runat="server" Value='<%# Eval("EmployeeID") %>' />
</ItemTemplate>
</asp:TemplateField>
--%> <asp:BoundField DataField="EmployeeID" HeaderText="Employee ID"
SortExpression="EmployeeID" Visible="true" ItemStyle-HorizontalAlign="Center">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="EmployeeName" HeaderText="Name" SortExpression="EmployeeName"
ItemStyle-Width="130px" ItemStyle-HorizontalAlign="Center">
<ItemStyle HorizontalAlign="Center" Width="130px" />
</asp:BoundField>
<asp:BoundField DataField="DateOfBirth" HeaderText="DoB" SortExpression="DateOfBirth"
DataFormatString="{0:dd-MM-yyyy}" ItemStyle-Width="100px" ItemStyle-HorizontalAlign="Center">
<ItemStyle HorizontalAlign="Center" Width="100px" />
</asp:BoundField>
<asp:BoundField DataField="Salary" HeaderText="Salary"
SortExpression="Salary">
<ItemStyle HorizontalAlign="Center" Width="90px" />
</asp:BoundField>
<asp:BoundField DataField="Gender" HeaderText="Gender" ItemStyle-Width="90px"
ItemStyle-HorizontalAlign="Center">
<ItemStyle HorizontalAlign="Center" Width="70px" />
</asp:BoundField>
<asp:TemplateField>
<ItemTemplate>
<asp:Button ID="EditBtn" runat="server" Text="Select" CausesValidation="false" OnClick="EditBtn_Click" />
<asp:Button ID="DelBtn" runat="server" Text="Delete" CausesValidation="false" OnClick="DelBtn_Click" OnClientClick="confirmDelete()" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EditRowStyle BackColor="#ffffff" />
<FooterStyle BackColor="#1C5E55" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="Gray" Font-Bold="false" ForeColor="White" />
<PagerStyle BackColor="Gray" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#E3EAEB" />
<SelectedRowStyle BackColor="#C5BBAF" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F8FAFA" />
<SortedAscendingHeaderStyle BackColor="#246B61" />
<SortedDescendingCellStyle BackColor="#D4DFE1" />
<SortedDescendingHeaderStyle BackColor="#15524A" />
</asp:GridView>
<br />
<span style="font-family: Arial; font-size: small; color: Green; font-weight: bold;">
You are viewing page <%=GridView1.PageIndex + 1%> of <%=GridView1.PageCount%>
</span>
</div>
<div>
<asp:Label ID="lblMessage" runat="server"></asp:Label></div>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
**code behind:**
#region GridView Functions
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
if (e.Row.Cells[4].Text == "True")
{
e.Row.Cells[4].Text = "Male";
}
else
{
e.Row.Cells[4].Text = "Female";
}
}
}
#endregion
The gridview Gender column shows true/false instead of male/female.
Thanks!

You need a TemplateField for this. Assuming Male equates to True, this should work:
<asp:TemplateField HeaderText="Gender" SortExpression="Gender">
<ItemTemplate><%# (Boolean.Parse(Eval("Gender").ToString())) ? "Male" : "Female" %></ItemTemplate>
</asp:TemplateField>

Ajax TabPanels trigger validation for other tabs in ASP.Net 4.0

I have Ajax TabPanel with Tab "Employee List" "Add Employee" "Edit Employee"
On Employee List Tab i use gridview to display list of employee along with link Button to view details of employee on same tab and "Del" button to delete employee. It worked fine but when i added Controls to Second tab "Add Employee" along with validation controls. After this gridview in Tab one is not working as it trigger validation on second Tab.
How can i stop this validation which is triggered by controls on Tab 1
Below is the code
<asp:TabContainer ID="TabContainer1" runat="server" Height="320px" Width="100%"
ActiveTabIndex="0" >
<asp:TabPanel ID="atpEmployeeList" runat="server" >
<HeaderTemplate>Employee List</HeaderTemplate>
<ContentTemplate>
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td class="style1" align="left" valign="top">
<b>Employee List</b>
<asp:GridView ID="gvEmployeeList" runat="server" AutoGenerateColumns="False"
DataKeyNames="eCode" BackColor="White" BorderColor="#336666"
BorderStyle="None" BorderWidth="2px" CellPadding="4"
GridLines="Horizontal" onrowcommand="gvEmployeeList_RowCommand"
onrowdatabound="gvEmployeeList_RowDataBound" >
<Columns>
<asp:BoundField DataField="eSno" HeaderText="ID" InsertVisible="False"
ReadOnly="True" SortExpression="eSno" />
<asp:BoundField DataField="eFirstName" HeaderText="First Name"
SortExpression="eFirstName" />
<asp:BoundField DataField="eLastName" HeaderText="Last Name"
SortExpression="eLastName" />
<asp:BoundField DataField="eDepartment" HeaderText="Department"
SortExpression="eDepartment" />
<asp:BoundField DataField="eSalary" HeaderText="Salary"
SortExpression="eSalary" />
<asp:TemplateField HeaderText="Details">
<ItemTemplate>
<asp:LinkButton ID="lnkBtnEmpDetails" CommandArgument='<%# Eval("eSno") %>' CommandName="ViewDetails" runat="server">
View</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Delete">
<ItemTemplate>
<asp:LinkButton ID="lnkBtnEmpDelete" CommandArgument='<%# Eval("eSno") %>' CommandName="Delete" runat="server">
Del</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="White" ForeColor="#333333" />
<HeaderStyle BackColor="#336699" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#336699" ForeColor="White" HorizontalAlign="Right" />
<RowStyle BackColor="White" ForeColor="#333333" />
<SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F7F7F7" />
<SortedAscendingHeaderStyle BackColor="#487575" />
<SortedDescendingCellStyle BackColor="#E5E5E5" />
<SortedDescendingHeaderStyle BackColor="#275353" />
</asp:GridView>
</td>
<td width="250px" align="left" valign="top">
<b>Employee Details</b>
<br />
<table width="280px" align="left" cellpadding="3" cellspacing="0" >
<tr>
<td class="style8" bgcolor="#336699">
Code</td>
<td>
<asp:Label ID="lblEmpCode" runat="server" ></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Fisrt Name</td>
<td>
<asp:Label ID="lblFirstName" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style5" bgcolor="#336699">
Last Name</td>
<td class="style6">
<asp:Label ID="lblLastName" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Designation</td>
<td>
<asp:Label ID="lblDesignation" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Department</td>
<td>
<asp:Label ID="lblDepartment" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Salary</td>
<td>
<asp:Label ID="lblSalary" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Join Date</td>
<td>
<asp:Label ID="lblJoinDate" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Phone</td>
<td>
<asp:Label ID="lblPhone" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
Address</td>
<td>
<asp:Label ID="lblAddress" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style8" bgcolor="#336699">
City</td>
<td>
<asp:Label ID="lblCity" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td class="style4">
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>
</ContentTemplate>
</asp:TabPanel>
<asp:TabPanel ID="atpAddEmployee" runat="server" >
<HeaderTemplate>Add Employee</HeaderTemplate>
<ContentTemplate>
<div><b>Enter Details of New Employee</b></div>
<table border="0px"><tr>
<td width="400px">
<div class="spacer"></div>
<div class="row">
<asp:Label ID="lblAEmpCode" CssClass="txtLabel" runat="server" Text="Code :"></asp:Label>
<asp:TextBox ID="txtACode" runat="server" CssClass="txt4Digit"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfvCode" runat="server" ErrorMessage="*"
ControlToValidate="txtACode"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblAFN" CssClass="txtLabel" runat="server" Text="First Name :"></asp:Label>
<asp:TextBox ID="txtAFN" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="*"
ControlToValidate="txtAFN"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblALN" CssClass="txtLabel" runat="server" Text="Last Name :"></asp:Label>
<asp:TextBox ID="txtALN" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="*"
ControlToValidate="txtALN"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblADesignation" CssClass="txtLabel" runat="server" Text="Designation :"></asp:Label>
<asp:TextBox ID="txtADesignation" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="*"
ControlToValidate="txtADesignation"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblADepartment" CssClass="txtLabel" runat="server" Text="Department :"></asp:Label>
<asp:TextBox ID="txtADepartment" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="*"
ControlToValidate="txtADepartment"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblASalary" CssClass="txtLabel" runat="server" Text="Salary :"></asp:Label>
<asp:TextBox ID="txtASalary" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="*"
ControlToValidate="txtASalary"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblAJoinDate" CssClass="txtLabel" runat="server" Text="Join Date :"></asp:Label>
<asp:TextBox ID="txtAJoinDate" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ErrorMessage="*"
ControlToValidate="txtAJoinDate"></asp:RequiredFieldValidator>
</div>
</td>
<td width="400px">
<div class="spacer"></div>
<div class="row">
<asp:Label ID="lblAAddress" CssClass="txtLabel" runat="server" Text="Address :"></asp:Label>
<asp:TextBox ID="txtAAddress" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ErrorMessage="*"
ControlToValidate="txtAAddress"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblACity" CssClass="txtLabel" runat="server" Text="City :"></asp:Label>
<asp:TextBox ID="txtACity" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" ErrorMessage="*"
ControlToValidate="txtACity"></asp:RequiredFieldValidator>
</div>
<div class="row">
<asp:Label ID="lblACountry" CssClass="txtLabel" runat="server" Text="Country :"></asp:Label>
<asp:UpdatePanel ID="updatepanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="ddCountry" runat="server" CssClass="ddGeneral" DataTextField="Country"
DataValueField="CountryId" OnSelectedIndexChanged="ddCountry_SelectedIndexChanged"
AutoPostBack="true" AppendDataBoundItems="true" >
<asp:ListItem Value="0">Select Country</asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="row">
<asp:Label ID="lblAState" CssClass="txtLabel" runat="server" Text="State :"></asp:Label>
<asp:UpdatePanel ID="updatePnlState" runat="server">
<ContentTemplate>
<asp:DropDownList ID="ddState" runat="server" CssClass="ddGeneral" DataTextField="Region" DataValueField="RegionId" AppendDataBoundItems="true">
<asp:ListItem Value="0">Select State</asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="updProgLoading" runat="server" >
<ProgressTemplate>
<img src="images/ajax-loader-small.gif" align="left" alt="Loading..." vspace="0" />
</ProgressTemplate>
</asp:UpdateProgress>
</div>
<div class="row">
<asp:Label ID="lblALL" CssClass="txtLabel" runat="server" Text="Landline :"></asp:Label>
<asp:TextBox ID="txtALL" runat="server" CssClass="txtbox"></asp:TextBox>
</div>
<div class="row">
<asp:Label ID="lblAMobile" CssClass="txtLabel" runat="server" Text="Mobile :"></asp:Label>
<asp:TextBox ID="txtAMobile" runat="server" CssClass="txtbox"></asp:TextBox>
</div>
<div class="row">
<asp:Label ID="lblAEmail" CssClass="txtLabel" runat="server" Text="Email :"></asp:Label>
<asp:TextBox ID="txtAEmail" runat="server" CssClass="txtbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator13" runat="server" ErrorMessage="*"
ControlToValidate="txtAEmail"></asp:RequiredFieldValidator>
</div>
</td>
</tr>
<tr><td colspan="2" align="center" height="40px">
<asp:Button ID="btnAddEmployee" runat="server" Text="Add Employee"
CssClass="btn" onclick="btnAddEmployee_Click" /> <input id="Reset1" type="reset" class="btn" value="Reset" />
</td></tr>
</table>
</ContentTemplate>
</asp:TabPanel>
<asp:TabPanel ID="atpEditEmployee" runat="server" >
<HeaderTemplate>Edit Employee</HeaderTemplate>
<ContentTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />
<input id="Button2" type="button" value="Next" onclick="MoveTab(1)" />
</ContentTemplate>
</asp:TabPanel>
</asp:TabContainer>

You should look at utilising the ValidationGroup attribute for validators. For example for all the validators in the atpAddEmployee tab you would set the attribute like so ValidationGroup="atpAddEmployee" or any other name that you think appropriate.
I've taken one of the validators from the atpAddEmployee tab and added the attribute as described above.
<asp:RequiredFieldValidator ID="rfvCode" runat="server" ErrorMessage="*" ControlToValidate="txtACode" ValidationGroup="atpAddEmployee"></asp:RequiredFieldValidator>
For that particular tab you would also need to add the ValidationGroup attribute to the button that should trigger the validation, see below.
<asp:Button ID="btnAddEmployee" runat="server" Text="Add Employee" CssClass="btn" onclick="btnAddEmployee_Click" ValidationGroup="atpAddEmployee" />
Some further reading, MSDN and W3Schools.

modal popup extender problem

i use modal popup extender to show my details in another separate window it is a panel contains some controls the problem is ::
when i click on my button which contains::
the Show() method the parent page just frozen and no popup appears at all on the other side i have a grid view when i click on the last button on it the popup appears where the other buttons on the grid view make the same behavior of my first button , i donot know what is the problem my panel visibility = true and no setting in my behind code..i view the source and i find the panel with its contents then why the popup window doesnot appear..i search alot but i donot find a solution to my problem ..
my aspx::
<asp:Panel id="master_editMode" runat="server" >
<div id="masterDiv" style="width:98%" dir="rtl">
<div id="masterControls" align="center">
<table border="0" width="98%">
<tr>
<td align="center" dir="rtl">
<asp:ObjectDataSource ID="ObjDS_AllTasks" runat="server"
SelectMethod="Get_All_Tasks" TypeName="DocumentFlowModuleDTO.TaskDTO">
</asp:ObjectDataSource>
<asp:HiddenField ID="hd_Task_Code" runat="server" />
<table>
<tr>
<td>
<asp:Label ID="Label11" runat="server" Text="Search for Task" Visible="False"></asp:Label>
</td>
<td align="right">
<asp:TextBox ID="txt_Search" runat="server" AutoPostBack="True"
ontextchanged="txt_Search_TextChanged" Width="200px" Visible="False"></asp:TextBox>
</td>
<td>
</td>
</tr>
<tr>
<td colspan="3">
<asp:GridView ID="grd_AllTasks" runat="server" AllowPaging="True"
AutoGenerateColumns="False" CssClass="Alternating" DataKeyNames="task_code"
DataSourceID="ObjDS_AllTasks"
onpageindexchanging="grd_AllTasks_PageIndexChanging"
onrowdatabound="grd_AllTasks_RowDataBound" style="margin-right: 0px">
<RowStyle VerticalAlign="Top" />
HeaderText="ÍÐÝ">
<ItemTemplate>
<asp:ImageButton ID="btn_Delete_Task" runat="server"
CommandArgument="<%# Bind('task_code') %>" Height="33px"
ImageUrl="~/Images/delete.png" oncommand="btn_Delete_Task_Command"
Width="67px" />
<cc1:ConfirmButtonExtender ID="btn_Delete_Task_ConfirmButtonExtender"
runat="server" ConfirmText="åá ÊÑíÏ ÍÐÝ æËíÞÉ ÇáÇÚÊãÇÏ ¿" Enabled="True"
TargetControlID="btn_Delete_Task">
</cc1:ConfirmButtonExtender>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle HorizontalAlign="Right" />
</asp:GridView>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="right" dir="rtl">
<asp:Label ID="lbl_TaskName" runat="server" Font-Bold="True" Font-Size="13pt"></asp:Label>
</td>
</tr>
<tr>
<td align="center" dir="rtl" style="height: 196px">
<table>
<tr>
<td align="left">
<asp:Label ID="lbl_No_States" runat="server" Font-Bold="True" ForeColor="Red"></asp:Label>
</td>
<td align="right">
<asp:ImageButton ID="btn_AddStatesToTask" runat="server"
ImageUrl="Images/add.png" onclick="btn_AddStatesToTask_Click" Visible="False" />
<asp:Button ID="Dummy_btn2" runat="server" Text="Button" Style="display:none;" />
<cc1:ModalPopupExtender ID="btn_AddStatesToTask_ModalPopupExtender"
runat="server"
TargetControlID="Dummy_btn2"
BackgroundCssClass="modalBackground"
PopupControlID="pnl_Add_States"
DropShadow="True">
</cc1:ModalPopupExtender>
</td>
</tr>
</table>
<asp:HiddenField ID="hd_StateSerial" runat="server" />
<asp:HiddenField ID="hd_StateRowIndex" runat="server" />
<asp:GridView ID="grd_States" runat="server" AllowPaging="True" DataKeyNames="state_serial"
onpageindexchanging="grd_States_PageIndexChanging" Visible="False"
CssClass="Alternating" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="state_name" HeaderText="ÇáãÑÍáÉ"
ShowHeader="False" />
<asp:BoundField DataField="state_order" HeaderText="ÊÑÊíÈ ÇáãÑÍáÉ"
ShowHeader="False" />
<asp:TemplateField HeaderText="Power" ShowHeader="False">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="chb_StatePower" runat="server"
Checked='<%# Convert.ToBoolean(Eval("power_flag")) %>' Enabled="False" />
</ItemTemplate>
<ItemStyle Width="40px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="New" ShowHeader="False">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox3" runat="server" />
<asp:Button ID="Dummy_btn4" runat="server" Text="Button" Style="display:none;" />
<cc1:ModalPopupExtender ID="btn_TaskState_Edit_ModalPopupExtender" runat="server"
TargetControlID="Dummy_btn4"
BackgroundCssClass="modalBackground"
PopupControlID="pnl_Add_States"
DropShadow="True">
</cc1:ModalPopupExtender>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="ÍÐÝ" ShowHeader="False">
<ItemTemplate>
<asp:ImageButton ID="btn_TaskState_Delete" runat="server"
CommandArgument="<%# Bind('state_serial') %>" Height="26px"
ImageUrl="~/Images/delete.png" oncommand="btn_TaskState_Delete_Command"
Width="47px" />
<cc1:ConfirmButtonExtender ID="btn_TaskState_Delete_ConfirmButtonExtender"
runat="server" ConfirmText="åá ÊÑíÏ ÍÐÝ ÇáãÑÍáÉ ¿" Enabled="True"
TargetControlID="btn_TaskState_Delete">
</cc1:ConfirmButtonExtender>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
</tr>
<tr>
<td>
<asp:ObjectDataSource ID="ObjectDataSource_States" runat="server"
SelectMethod="Select_TaskStates" TypeName="DocumentFlowModule.DTO.TaskStateDTO">
<SelectParameters>
<asp:Parameter Name="task_code" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>
</td>
</tr>
</table>
</div>
</div>
</asp:Panel>
<asp:Panel ID="pnl_Add_Task" runat="server" CssClass="modalPopup"><%-- Style="display:none;"--%>
<div id="div3" style="width: 95%">
<div id="div4" align="center">
<table>
<tr>
<td>
<asp:UpdatePanel ID="UpPnl1" runat="server">
<ContentTemplate>
<table dir="rtl" style="text-align: right">
<tr bgcolor="#f1ece2">
<th align="right" height="35" valign="middle" colspan="3">
<asp:Label ID="lbl_New_Task" runat="server" Font-Bold="False" Font-Size="14pt"
Text="ÅÖÇÝÉ æËíÞÉ ÇÚÊãÇÏ" Visible="False"></asp:Label>
<asp:Label ID="lbl_Edit_Task" runat="server" Font-Bold="False" Font-Size="14pt"
Text="ÊÚÏíá æËíÞÉ ÇÚÊãÇÏ" Visible="False"></asp:Label>
</th>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label1" runat="server" Text="Task Name"></asp:Label>
</td>
<td style="width: 140px">
<asp:TextBox ID="txt_TaskName" runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="txt_TaskName" ErrorMessage="*" ValidationGroup="G1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label10" runat="server" Text="DataBase Name"></asp:Label>
</td>
<td style="width: 140px">
<asp:DropDownList ID="ddl_DataBases" runat="server" AutoPostBack="True"
ondatabound="ddl_DataBases_DataBound"
onselectedindexchanged="ddl_DataBases_SelectedIndexChanged">
</asp:DropDownList>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server"
ControlToValidate="ddl_DataBases" ErrorMessage="*" InitialValue="--Select--"
ValidationGroup="G1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label2" runat="server" Text="Table Name"></asp:Label>
</td>
<td style="width: 140px">
<asp:DropDownList ID="ddl_Tables" runat="server" AutoPostBack="True"
ondatabound="ddl_Tables_DataBound"
onselectedindexchanged="ddl_Tables_SelectedIndexChanged">
</asp:DropDownList>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server"
ControlToValidate="ddl_Tables" ErrorMessage="*" InitialValue="--Select--"
ValidationGroup="G1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label17" runat="server" Text="Table Key"></asp:Label>
</td>
<td style="width: 140px">
<asp:Label ID="lbl_Key" runat="server"></asp:Label>
<asp:CheckBoxList ID="cbl_Columns" runat="server">
</asp:CheckBoxList>
</td>
<td>
<asp:Label ID="lbl_Select_Key" runat="server" ForeColor="Red"></asp:Label>
</td>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label18" runat="server" Text="Current Record State"></asp:Label>
</td>
<td style="width: 140px">
<asp:DropDownList ID="ddl_Columns" runat="server" AutoPostBack="True"
ondatabound="ddl_Columns_DataBound">
</asp:DropDownList>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server"
ControlToValidate="ddl_Columns" ErrorMessage="*" InitialValue="--Select--"
ValidationGroup="G1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label5" runat="server" Text="Form View "></asp:Label>
</td>
<td style="width: 140px">
<asp:TextBox ID="txt_F_View" runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server"
ControlToValidate="txt_F_View" ErrorMessage="*" InitialValue="--Select--"
ValidationGroup="G1"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="title" width="160">
<asp:Label ID="Label6" runat="server" Text="Form New"></asp:Label>
</td>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
<tr>
<td dir="rtl" align="center">
<asp:ImageButton ID="btn_OK" runat="server" ImageUrl="~/Images/add.png"
onclick="btn_OK_Click" ValidationGroup="G1" Visible="False" />
<asp:ImageButton ID="btn_Edit" runat="server" ImageUrl="~/Images/edit.png"
onclick="btn_Edit_Click" ValidationGroup="G1" Visible="False" />
<asp:ImageButton ID="btn_Cancel_Task" runat="server" CausesValidation="False"
Height="36px" ImageUrl="~/Images/cancel.png" onclick="btn_Cancel_Task_Click" />
</td>
</tr>
</table>
</div>
</div>
</asp:Panel>
the btn_add _task does not make my popup appear just freeze the parent page
my .cs
protected void btn_Add_Task_Click(object sender, EventArgs e)
{
//AjaxControlToolkit.ModalPopupExtender modal1 = (AjaxControlToolkit.ModalPopupExtender) table1.FindControl("btn_Add_Task_ModalPopupExtender");
//modal1.Show();
grd_States.Visible = false;
lbl_No_States.Text = "";
btn_AddStatesToTask.Visible = false;
lbl_TaskName.Text = "";
//master_editMode.Visible = true;
//pnl_Add_Task.Visible = true;
btn_OK.Visible = true;
btn_Edit.Visible = false;
lbl_New_Task.Visible = true;
lbl_Edit_Task.Visible = false;
txt_TaskName.Text = "";
ddl_DataBases.ClearSelection();
ddl_Tables.Items.Clear();
ddl_Columns.Items.Clear();
cbl_Columns.Items.Clear();
txt_F_New.Text = "";
txt_F_View.Text = "";
txt_Params.Text = "";
txt_SP_Name.Text = "";
btn_Add_Task_ModalPopupExtender.Show();
}
thanks in advance
EDITED::
<table align="center" dir="rtl">
<tr>
<td >
<asp:Button ID="Dummy_btn" runat="server" Text="Button" Style="display:none;" />
<asp:Button ID="btn_Add_Task" runat="server" Text="ÅÖÇÝÉ æËíÞÉ ÇÚÊãÇÏ ÌÏíÏÉ"
onclick="btn_Add_Task_Click" Font-Bold="True" Font-Size="12pt"
ForeColor="#0066FF" />
<cc1:ModalPopupExtender ID="btn_Add_Task_ModalPopupExtender" runat="server"
TargetControlID="Dummy_btn"
PopupControlID="pnl_Add_Task"
BackgroundCssClass="modalBackground"
DropShadow="True" >
</cc1:ModalPopupExtender>
</td>
</tr>
</table>`

If you want your modal popup to be displayed when the user clicks on the btn_Add_Task button, you should set that button as the TargetControlID of the extender:
<cc1:ModalPopupExtender ID="btn_Add_Task_ModalPopupExtender" runat="server"
TargetControlID="btn_Add_Task" PopupControlID="pnl_Add_Task"
BackgroundCssClass="modalBackground" DropShadow="True" />
In your current code, the modal popup is triggered by a button named Dummy_btn, which I can't find in your markup, but which probably isn't what you want.

We had many issues with ajax popup. you might want to try the approach we have been using for past one month or so with out any issues. This approach creates a popup with out need of ajax / jquery / javascript /css/ update panel .
here:
A modal popup with out using ajax, update panel, jquery or javascript- surprisingly this seems to work