We Keep Coding

Placing a repeater inside an AjaxToolKit Accordion

I am trying to use a repeater inside an AjaxToolKit Accordion. This is necessary because I need pagination within my DataList using a SQL stored procedure. It works fine if I place the repeater outside of the AjaxToolKit Accordion, but I need to place the repeater inside the accordion. I am accessing the inner repeater (from code-behind) by placing an outer repeater outside of my Ajax Accordion. However, I'm still getting an error:
Type 'System.Web.UI.WebControls.Repeater' does not have a public property named 'Accordion'.
Here is my asp.net webform:
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:Repeater ID="RepeaterOutside" runat="server">
<ajaxToolkit:Accordion ID="Accordion1" runat="server" HeaderCssClass="accordion" ContentCssClass="accordion" HeaderSelectedCssClass="accordion" FadeTransitions="true" TransitionDuration="500" AutoSize="None" SelectedIndex="-1" RequireOpenedPane="false">
<Panes>
<ajaxToolkit:AccordionPane ID="AccordionPane1" runat="server">
<Header>
<p>Click selection for details.</p>
<div class="panel panel-default">
<div class="alertHeading" style="color: red; background-color: lightgray; font-weight: 700; padding: 1em; border-radius: 5px; border: dashed 1px; border-color: black;">ACCOUNT DETAILS</div>
</div>
</Header>
<Content>
<div id="titleAccountResults" runat="server" visible="true">
<div class="form-group">
<h6>Account Details:</h6>
</div>
</div>
<asp:DataList ID="DataListAccount" runat="server">
<ItemTemplate>
<tr>
<td style="width: 171px">Account Number:</td>
<td style="width: 220px">
<asp:Label ID="lblAccountNumber" runat="server" Text='<%# Eval("ACCOUNT_NUMBER") %>'></asp:Label>
</td>
</tr>
<asp:PlaceHolder ID="PlaceHolder36" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("ACCOUNT_STATUS").ToString()) ? true : false %>'>
<tr id="rowAccountStatusAccount">
<td style="width: 171px">Account Status:</td>
<td style="width: 220px">
<asp:Label ID="lblAccountStatus" runat="server" Text='<%# Eval("ACCOUNT_STATUS") %>'></asp:Label>
</td>
</tr>
</asp:PlaceHolder>
<asp:PlaceHolder ID="PlaceHolder35" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("ACCOUNT_NAME").ToString()) ? true : false %>'>
<tr id="rowAccountNameAccount" runat="server">
<td style="width: 171px">Account Name:</td>
<td style="width: 220px">
<asp:Label ID="lblAccountName" runat="server" Text='<%# Eval("ACCOUNT_NAME") %>'></asp:Label>
</td>
</tr>
</asp:PlaceHolder>
</ItemTemplate>
</asp:DataList>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
<HeaderTemplate>
<hr />
</HeaderTemplate>
<Panes>
<ajaxToolkit:AccordionPane ID="AccordionPane2" runat="server">
<Header>
<div class="panel panel-default">
<div class="alertHeading" style="color: red; background-color: lightgray; font-weight: 700; padding: 1em; border-radius: 5px; border: dashed 1px; border-color: black;">PAYMENT DETAILS</div>
</div>
</Header>
<Content>
<div id="Div1" runat="server" visible="true">
<div class="form-group">
<h6>Contact Details:</h6>
</div>
</div>
<asp:DataList ID="DataListContact" runat="server">
<ItemTemplate>
<tr>
<td style="width: 171px">Account Number:</td>
<td style="width: 220px">
<asp:Label ID="lblAccountNumber" runat="server" Text='<%# Eval("ACCOUNT_NUMBER") %>'></asp:Label>
</td>
</tr>
<asp:PlaceHolder ID="" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("COMPANY_NAME").ToString()) ? true : false %>'>
<tr>
<td style="width: 171px">Company Name:</td>
<td style="width: 220px">
<asp:Label ID="lblCompanyName" runat="server" Text='<%# Eval("COMPANY_NAME") %>'></asp:Label>
</td>
</tr>
</asp:PlaceHolder>
<asp:PlaceHolder ID="" runat="server" Visible='<%# !string.IsNullOrEmpty(Eval("COMPANY_ADDRESS").ToString()) ? true : false %>'>
<tr>
<td style="width: 171px">Address:</td>
<td style="width: 220px">
<asp:Label ID="" runat="server" Text='<%# Eval("COMPANY_ADDRESS") %>'></asp:Label>
</td>
</tr>
</asp:PlaceHolder>
<asp:Repeater ID="rptPager" runat="server">
<ItemTemplate>
<asp:Button ID="lnkPage" class="btn btn-outline-primary" runat="server" Text='<%#Eval("Text") %>' CommandArgument='<%# Eval("Value") %>'
CssClass='<%# Convert.ToBoolean(Eval("Enabled")) ? "page_enabled" : "page_disabled" %>'
OnClick="Page_Changed" OnClientClick='<%# !Convert.ToBoolean(Eval("Enabled")) ? "return false;" : "" %>'></asp:Button>
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
</asp:DataList>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion></asp:Repeater></asp:Content>

I found the solution. Place the repeater inside separate content tags and within the accordion's content tags. Also, no need to call the repeater by an outside repeater through code behind as stated above. I removed the outside repeater. It's working now.
<content>repeater goes here</content>

JavaScript Function

I want to store TextBox value in HidenField and i am calling javascript function on button click function is calling getting message Hi but... textBox getting null....I am using asp.net TextBox and also i have tried with HTML textBox also but same scenario happing in both the case...Actually HTML code using in Ajax Tab Container may be this problem ...
How to solve such type of problem
function f11() {
alert("Hi")
alert("hi..." + document.getElementById("txthtmltextbox").value)
document.getElementById("txtuncheaderHF").value = document.getElementById("txthtmltextbox").value;
document.getElementById("txtrootFolderHF").value = document.getElementById("txthtmltextboxroot").value
}
This is my HTML code
<asp:Panel ID="pnlhfconfig" runat="server" Height="100%" Width="100%">
<table bordercolor="gainsboro" bgcolor="white" style="border-bottom-width: 1px; border-bottom-style: solid;
border-top-width: 1px; border-top-style: solid; border-left-width: 1px; border-left-style: solid;
border-right-width: 1px; border-right-style: solid; border-bottom-color: #8C8B83;
border-top-color: #8C8B83; border-left-color: #8C8B83; border-right-color: #8C8B83;"
id="TABLE2" language="javascript">
<tbody>
<tr>
<td colspan="3" bgcolor="#E5E5E5" height="20" class="topnav" style="font-size: 10px;
font-family: verdana">
<font style="color: #000000"><strong>
<asp:Literal ID="Literal4" runat='server' Text='HF Configuration'></asp:Literal>  </strong></font>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lbluncheader" runat="server" Text='HotFolder UNCHeader'></asp:Label>
</td>
<td>
<input type="text" id="txthtmltextbox" name="txthtmltextbox" onblur="f1()" runat="server" MaxLength="50" Style="z-index: 102;" Width="250px" />
<asp:RequiredFieldValidator ID="rfvuncheader" runat="server"
ErrorMessage="UNCHeader is required." ControlToValidate="txthtmltextbox" Display="None"
ValidationGroup="save"></asp:RequiredFieldValidator>
</td>
<td>
<asp:Label ID="Label1" runat="server" Font-Bold="True" ForeColor="Red" Text="*"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblrootfolder" runat="server" Text='Hot RootFolder'></asp:Label>
</td>
<td>
<input type="text" id="txthtmltextboxroot" name="txthtmltextboxroot" runat="server" MaxLength="50" Style="z-index: 102;" Width="250px" />
<%-- <asp:TextBox ID="txtrootfolder" runat="server" MaxLength="50" Width="250px"></asp:TextBox>--%><asp:RequiredFieldValidator
ID="rfvUNH" runat="server" ErrorMessage="RootFolder is required." ControlToValidate="txthtmltextboxroot"
Display="None" ValidationGroup="save"></asp:RequiredFieldValidator>
</td>
<td>
<asp:Label ID="Label2" runat="server" Font-Bold="True" ForeColor="Red" Text="*"></asp:Label>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<table>
<tr>
<td>
<asp:Button ID="btnsave" OnClientClick ="f1()" runat="server" Text='Save' Width="55px" BackColor="#E5E5E5"
ForeColor="Black" ValidationGroup="save" />
</td>
<td>
<asp:Button ID="btncancel" runat="server" Text='Cancel' Width="55px" BackColor="#E5E5E5"
ForeColor="Black" />
</td>
</tr>
<tr>
<td>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" ShowMessageBox="True"
ShowSummary="False" ValidationGroup="save" />
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</asp:Panel>

Hope you aware of JQuery and using JQuery, you will easily get inner control of panel. Because when your page is render on browser. Html code is something different then .NET(ASPX page).
You will get/set panel inner control value using below statement.
$("#<%=pnlhfconfig.ClientID %> input[id='<%= txtuncheaderHF.ClientID %>']").val($("#<%=pnlhfconfig.ClientID %> input[id='<%= txthtmltextbox.ClientID %>']").val());

You are using txthtmltextbox please check on console what is the actual ID of control while generating html.
Or use as
document.getElementById("<%= txthtmltextbox.ClientID%>").value

Find Label Control in Repeater Asp.net

I am using repeater and I want to find the label control in my repeater. here is my code
<asp:Repeater ID="friendRepeater" runat="server">
<table cellpadding="0" cellspacing="0">
<ItemTemplate>
<tr style=" width:700px; height:120px;">
<td>
<div style=" padding-left:180px;">
<div id="leftHandPost" style="float:left; width:120px; height:120px; border: medium solid #cdaf95; padding-top:5px;">
<div id="childLeft" style=" padding-left:5px;">
<div id="photo" style=" border: thin solid black; width:100px;height:100px;">
<asp:Image id="photoImage" runat="server" ImageUrl='<%# String.Concat("Images/", Eval("Picture")) %>' Width="100px" Height="100px" />
</div>
</div><!--childLeft-->
</div><!--leftHandPost-->
</div>
</td>
<td>
<div id="rightHandPost" style=" float:right; padding-right:260px;">
<div id="childRight" style="width:400px; height:120px; border: medium solid #cdaf95; padding-top:5px; padding-left:10px;">
<strong><asp:Label id="lblName" runat="server"><%# Eval("PersonName") %></asp:Label></strong><br />
<div style=" float:right; padding-right:10px;"><asp:Button runat="server" Text="Add" onClick="add" /></div><br />
<asp:Label id="lblID" runat="server"><%# Eval("PersonID") %></asp:Label><br />
<asp:Label id="lblEmail" runat="server"><%# Eval("Email") %></asp:Label>
</div><!--childRight-->
</div><!--rightHandPost-->
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style=" width:700px; height:120px;">
<td>
<div style=" padding-left:180px;">
<div id="Div1" style="float:left; width:120px; height:120px; border: medium solid #cdaf95; padding-top:5px;">
<div id="Div2" style="padding-left:5px;">
<div id="Div3" style=" border: thin solid black; width:100px;height:100px;">
<asp:Image id="photoImage" runat="server" ImageUrl='<%# String.Concat("Images/", Eval("Picture")) %>' Width="100px" Height="100px" />
</div>
</div><!--childLeft-->
</div><!--leftHandPost-->
</div>
</td>
<td>
<div id="Div4" style=" float:right; padding-right:260px;">
<div id="Div5" style="width:400px; height:120px; border: medium solid #cdaf95; padding-top:5px; padding-left:10px;">
<strong><asp:Label id="lblName" runat="server"><%# Eval("PersonName")%></asp:Label></strong>
<div style=" float:right; padding-right:10px;"><asp:Button id="btnAdd" runat="server" Text="Add" onClick="add"></asp:Button></div><br />
<br />
<asp:Label id="lblID" runat="server"><%# Eval("PersonID") %></asp:Label><br />
<asp:Label id="lblEmail" runat="server"><%# Eval("Email") %></asp:Label>
</div><!--childRight-->
</div><!--rightHandPost-->
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
Here is the code behind for the add button.
protected void add(object sender, EventArgs e)
{
DateTime date = DateTime.Now;
System.Web.UI.WebControls.Label la = (System.Web.UI.WebControls.Label)friendRepeater.FindControl("PersonID");
String id = la.Text;
try
{
MySqlConnection connStr = new MySqlConnection();
connStr.ConnectionString = "Server = localhost; Database = healthlivin; Uid = root; Pwd = khei92;";
String insertFriend = "INSERT INTO contactFriend(friendID, PersonID, PersonIDB, date) values (#id, #personIDA, #personIDB, #date)";
MySqlCommand cmdInsertStaff = new MySqlCommand(insertFriend, connStr);
cmdInsertStaff.Parameters.AddWithValue("#id", "F000004");
cmdInsertStaff.Parameters.AddWithValue("#personIDA", "M000001");
cmdInsertStaff.Parameters.AddWithValue("#personIDB", id);
cmdInsertStaff.Parameters.AddWithValue("#date", date);
connStr.Open();
cmdInsertStaff.ExecuteNonQuery();
MessageBox.Show("inserted");
connStr.Close();
}
catch (Exception ex)
{
MessageBox.Show(ex.ToString());
}
}
I have get the error of Object reference not set to an instance of an object. I think is because there are no value in the Label. The Find Control are not working. May I know how can fix this problem? Thank you very much

foreach (RepeaterItem item in friendRepeater.Items)
{
Label lab = item.FindControl("lblName") as Label;
}

I think you can use this:
var personId= (Label)friendRepeater.Items[0].FindControl("PersonID");

The problem is you don't have any Label names "personID", so it couldn't find that control.
I assume that you want to get value from this line
<asp:Label id="lblID" runat="server"><%# Eval("PersonID") %></asp:Label>
And this Label control names "lblID", so your query code should be
System.Web.UI.WebControls.Label la = (System.Web.UI.WebControls.Label)friendRepeater.FindControl("lblID");
Use lblID to find control instead of PersonID

This worked for me.
Label lblperson = (Label)(rpfrndRepeater.Items[0]).FindControl("lblPerson");

My Website not Working with ajaxcontroltoolkit 3.5 IIS 7.5

I have a website with asp.net C# when hosted locally works fine.
When Used with IIS 7.5 and Windows Server 2008 ajax control tool kit does not work properly. Can anyone help me please.
Error shown in FireBug:
NetworkError: 404 Not Found - http://www.acmeinfovision.com/Settings/ClientSalaryHeadSetting.aspx?_TSM_HiddenField_=ctl00_ToolkitScriptManager1_HiddenField&_TSM_CombinedScripts_=%3b%3bAjaxControlToolkit%2c+Version%3d3.5.60501.0%2c+Culture%3dneutral%2c+PublicKeyToken%3d28f01b0e84b6d53e%3aen-US%3a61715ba4-0922-4e75-a2be-d80670612837%3af2c8e708%3ade1feab2%3a720a52bf%3af9cec9bc%3a589eaa30%3aa67c2700%3aab09e3fe%3a87104b7c%3a8613aea7%3a3202a5a2%3abe6fb298%3aaf404b5%3a698129cf%3abb25728f%3a289e72ab"
Client...89e72ab
Sys.Extended is undefined
[Break On This Error] ...tl00_DropPanel"),"dynamicServicePath":"/Settings/ClientSalaryHeadSetting.aspx","...
Master Page Code Looks Like this
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="AcmePayRoll.Site" %>
<!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 runat="server">
<meta http-equiv="Page-Enter" content="blendTrans(Duration=0)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0)" />
<title></title>
<link href='<%# this.ResolveCSS("~/css/Stylesheet_mini.css")%>' rel='stylesheet'
type='text/css' />
<link href='<%# this.ResolveCSS("~/css/ui-Redmond/jquery-ui_mini.css")%>' rel='stylesheet'
type='text/css' />
<link href='<%# this.ResolveCSS("~/css/demo_table_jui_mini.css") %>' rel='stylesheet'
type='text/css' />
<link href='<%# this.ResolveCSS("~/css/ColVis_mini.css")%>' rel='stylesheet' type='text/css' />
<link href='<%# this.ResolveCSS("~/css/TableTools_mini.css") %>' rel='stylesheet'
type='text/css' />
<link href='<%# this.ResolveCSS("~/css/TableTools_JUI_mini.css")%>' rel='stylesheet'
type='text/css' />
<link href='<%# this.ResolveCSS("~/css/ColReorder_mini.css")%>' rel='stylesheet'
type='text/css' />
<script src='<%# this.ResolveJS("~/js/jquery-1.7.1.min.js") %>' type='text/javascript'></script>
<script src='<%# this.ResolveJS("~/js/jquery-ui-1.8.17.custom.min.js") %>' type='text/javascript'></script>
<script src='<%# this.ResolveJS("~/js/Themeswither/TmemeSwither_mini.js") %>' type='text/javascript'></script>
<script src='<%# this.ResolveJS("~/js/ScrollableGrid_mini.js") %>' type='text/javascript'></script>
<script src='<%# this.ResolveJS("~/js/PayrollCommon_mini.js") %>' type='text/javascript'></script>
<script src='<%# this.ResolveJS("~/js/jquery.table_navigation_mini.js")%>' type='text/javascript'></script>
<link rel='SHORTCUT ICON' href='<%# this.ResolveUrl("~/Images/Acme-Logo.ICO")%>' />
<script type="text/javascript">
document.write("<div id='loading'><img id='pic1' src='<%# this.ResolveUrl("~/Images/15.gif") %>' /><br>Please Wait...</div>");
$(document).ready(function() {
var url='<%# this.ResolveUrl("~/") %>';
AddThemeSwither("ThemeSwither",url);
ApplyCommonStyles();
scrlsts();
$("#contentdiv").height($(window).height());
$("#contentdiv").width($(window).width());
});
function check()
{
var grid = $("<%# grid_clients.ClientID %>");
$(grid).Scrollable({ ScrollHeight: 70 });
}
function help_click(e) {
var helpurl= $(e.parentNode).find("input[type='hidden']");
var val=helpurl.val();
if(val!="")
{
window.open(val,'win');
}
}
</script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
#ThemeSwither
{
width: 200px;
position: absolute;
margin-left: auto;
overflow: inherit;
top: 5px;
left: 15px;
}
</style>
</head>
<body style="margin: 0; background-color: #FDF8FF;" >
<div style="vertical-align: top; width: 100%; height: 144px; top: 0; margin: 0;">
<form id="form1" runat="server">
<div id="contentdiv" style="width: 100%; border-bottom-color: Black">
<ajaxtoolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" ScriptMode ="Release" EnablePageMethods ="true" CompositeScript-ScriptMode ="Release" LoadScriptsBeforeUI="false">
</ajaxtoolkit:ToolkitScriptManager>
<%--<asp:ScriptManager ID ="ScriptManager1" runat ="server" >
</asp:ScriptManager>--%>
<table width="100%" style="height: 100%" border="0" cellpadding="0" cellspacing="0">
<tr class="ui-state-hover" style="vertical-align: top; height: 8%">
<td style="width: 20%">
<div id="ThemeSwither">
</div>
<asp:ImageButton ID="btnDashboard" runat="server" BorderStyle="None" Style="position: absolute;
margin-left: auto; overflow: inherit; top: 65px; left: 15px;" ImageUrl="~/Images/Dashboard48.png"
ToolTip="Dashboard" AlternateText="Dashboard" DescriptionUrl="~/Dashboard/Dashboard.aspx"
OnClick="btnDashboard_Click" />
</td>
<td colspan="2" style="text-align: right">
<table width="100%">
<tr style="vertical-align: top">
<td colspan="2" align="right">
<asp:Label ID="lbluserid" runat="server" CssClass="ui-state-hover" Text="User Id"
Style="border: 0px; position: static; font-family: Cambria; font-size: medium"></asp:Label>
</td>
<td style="width: 10%; vertical-align: top" align="right">
<a href="" runat="server" id="cmdSignOut" style="font-family: Cambria; font-size: 15px;
vertical-align: top">SignOut</a>
<input type="hidden" id="hidden_help_url" runat="server" />
<asp:ImageButton ID="helpbutton" runat="server" ImageUrl="~/Images/help-icon.png"
Height="20px" Width="20px" ToolTip="Help" OnClientClick="help_click(this); return false;" />
</td>
</tr>
<tr>
<td align="center">
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Image ID="clientlogo" runat="server" Height="35px" Width="31px" ImageAlign="Bottom" />
<asp:Label ID="lblclientid" runat="server" CssClass="ui-state-hover" Text="Client Id"
Style="border: 0px; font-family: Cambria; font-size: larger"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</td>
<td>
</td>
<td align="right">
<table>
<tr>
<td>
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<ajaxtoolkit:ModalPopupExtender ID="DropDownExtender2" runat="server" TargetControlID="lblclient"
PopupControlID="Panel1" BackgroundCssClass="modalBackground" DropShadow="true"
CancelControlID="CancelSubmitCompanies" />
<asp:ImageButton ID="lblclient" runat="server" ToolTip="Client List" Height="40px"
OnClientClick="check()" Width="40px" ImageUrl="~/Images/apartment-icon.png" Visible="false"
AccessKey="c" />
</ContentTemplate>
</asp:UpdatePanel>
</td>
<td>
<asp:Panel ID="DropPanel" Style="display: none" runat="server" Width="200px" BackColor="#f4f4f4"
BorderStyle="Solid">
</asp:Panel>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<ajaxtoolkit:DropDownExtender ID="DropDownExtender1" runat="server" TargetControlID="lblSelect"
DropDownControlID="DropPanel">
</ajaxtoolkit:DropDownExtender>
<asp:ImageButton ID="lblSelect" runat="server" ToolTip="Financial Year List" Height="35px"
Width="35px" ImageUrl="~/Images/Calendar-icon.png" OnClick="lblSelect_Click"
AccessKey="y" />
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="3">
<div>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
</td>
</tr>
<tr style="height: 83%; vertical-align: top">
<td colspan="3">
<div class="ui-widget-header" id="nav-menu">
<asp:Menu ID="MnuSiteMenus" runat="server" Orientation="Horizontal" DynamicHoverStyle-CssClass="dmenuHover"
Font-Bold="false" AccessKey="n" Font-Names="Cambria" DynamicMenuStyle-CssClass="ui-state-hover"
DynamicBottomSeparatorImageUrl="~/Images/LineSeparator.png" StaticItemFormatString="&nbsp &nbsp {0}">
</asp:Menu>
</div>
<div style="text-align: center" class="ui-state-hover">
<asp:Label ID="mainlabel" runat="server" Text="" Font-Size="X-Large" Font-Names="cambria"></asp:Label>
</div>
<div style="border-left-width: 30px; border-left-style: solid; border-left-color: #FDF8FF;
border-right-width: 30px; border-right-style: solid; border-right-color: #FDF8FF">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</td>
</tr>
<tr class="ui-state-hover" style="vertical-align: top; background-color: #FFEFDB;
height: 4%">
<td colspan="3" style="text-align: right">
<div>
<p style="text-align: right; font-size: small; font-family: Cambria;">
<marquee behavior="alternate" scrollamount="2" width="100%">Copyright © 2012 Acme Infovision Systems Pvt. Ltd. All Rights Reserved.</marquee>
</p>
</div>
</td>
</tr>
</table>
</div>
<asp:Panel ID="Panel1" runat="server" BackColor="#f4f4f4" Style="display: none; overflow: hidden;"
Visible="false" BorderStyle="Solid">
<asp:UpdatePanel ID="UpdatePanelrptClientList" runat="server">
<ContentTemplate>
<div style="text-align: center; font-size: large">
<asp:Label ID="grid_label" runat="server" Text="List of Clients" CssClass="all_inputs_labels"></asp:Label>
</div>
<div style="height: 220px; overflow: scroll">
<grid:MyGridView ID="grid_clients" ScrollWidthInpx="400" Width="600px" runat="server"
AllowSorting="true" AutoGenerateColumns="false" SelectedIndex="0" Font-Size="17px"
MouseHoverRowHighlightEnabled="true" CssClass="all_labels_inputs" ColumnNoToTrace="0">
<Columns>
<asp:BoundField DataField="ClientName" HeaderStyle-HorizontalAlign="Left" HeaderText="ClientName">
<HeaderStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:TemplateField HeaderText="Client Name">
<ItemTemplate>
<asp:LinkButton ID="lb" Text='<%# Eval("ClientName")%>' runat="server" OnClick="lbtn1_Click" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Contact" HeaderStyle-HorizontalAlign="Left" HeaderText="Contact">
<HeaderStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:BoundField DataField="ClientId" HeaderStyle-HorizontalAlign="Left" HeaderText="ClientId">
<HeaderStyle HorizontalAlign="Left" />
</asp:BoundField>
</Columns>
<FooterStyle BackColor="#3B4990" Font-Bold="True" ForeColor="White" />
<PagerStyle CssClass="ui-state-hover" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle CssClass="all_labels_inputs ui-state-hover" Font-Bold="True" />
</grid:MyGridView>
</div>
<div style="text-align: center">
<asp:Button ID="CancelSubmitCompanies" runat="server" Text="Cancel" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
</form>
</div>
</body>
</html>

Sys.Extended is undefined
but it is working on local IIS 6, IIS 7 IIS 7.5
From all your questions that are the same with this one I conclude that you have forget to include the AjaxControlToolkit.dll on your bin directory.
If you do have included then you did not have correct registered on your web.config on the different server.

ListView control

I have designed a mockup in Photoshop and I intend to apply it to my product catalog's ListView control but it does not seem to be displaying it right (misaligned?) and I hope someone here could pintpoint my mistake as I've been trying to figure out to no avail.
Expected result/Mockup:
After debug (don't mind the missing photos):
Take a look at my codes,
CSS:
.productItem {
width: 200px;
float: left;
padding: 5px;
margin: 5px;
text-align: center;
background-color: White;
}
.cell1
{
width:117px;
height:27px;
background-image: url("images/blackbutton.jpg");
float:left;
font-size:12px;
vertical-align:middle;
color:White;
text-align:center;
}
.cell2
{
width:118px;
height:27px;
background-image: url("images/orangebutton.jpg");
float:left;
font-size:12px;
vertical-align:middle;
color:White;
text-align:center;
}
ListView narkup:
<div class="catalog">
<asp:ListView runat="server" ID="listView" GroupItemCount="3" DataSourceID="AccessDataSource1">
<LayoutTemplate>
<div style="height: 962px;">
<div style="width: 790px;">
<asp:PlaceHolder runat="server" ID="groupPlaceHolder" />
<asp:DataPager runat="server" ID="dpMyDatePager" PageSize="3" PagedControlID="listView" .Ю
</div>
</LayoutTemplate>
<GroupTemplate>
<div style="clear: both;">
<asp:PlaceHolder runat="server" ID="itemPlaceHolder" />
</div>
</GroupTemplate>
<ItemTemplate>
<div class="productItem">
<div>
<img src='<%# Eval("ProductUrl") %>' height="180" width="200" />
</div>
<div>
<b>
<%# Eval("ProductBrand") %> <%# Eval("ProductModel") %></b>
</div>
<div>
Our Price: $<%# Eval("NormalPrice") %>
</div>
</div>
<div class="cell1">Add to cart</div>
<div class="cell2">View details</div>
</ItemTemplate>
</asp:ListView>
</div>

Change cell1 and cell2 width to 50%
and try following layout:
<LayoutTemplate>
<div style="height: 962px;">
<div style="width: 790px;">
<asp:PlaceHolder runat="server" ID="groupPlaceHolder" />
</div>
<asp:DataPager runat="server" ID="dpMyDatePager" PageSize="6" PagedControlID="listView"></asp:DataPager>
</div>
</LayoutTemplate>
<GroupTemplate>
<div style="clear: both;">
<asp:PlaceHolder runat="server" ID="itemPlaceHolder" />
</div>
</GroupTemplate>
<ItemTemplate>
<div class="productItem">
<div>
<img src='<%# Eval("ProductUrl") %>' height="180" width="200" />
</div>
<div>
<b>
<%# Eval("ProductBrand") %>
<%# Eval("ProductModel") %></b></div>
<div style="clear: right;">
Our Price: $<%# Eval("NormalPrice") %></div>
<div class="cell1">
Add to cart</div>
<div class="cell2">
View details</div>
</div>
</ItemTemplate>