Hello all,
I am having a problem in radpanelbar particularly in IE9, The problem is whenever I made an Ajax Request using RadAjaxManager from client script. my RadPanelbar Items moves one step down automatically. Please find me the solution because I already spend LOT in this.
Here is my aspx page
................................................................................................................................................................................................................
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="RadPanelBarTester._Default" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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">
<title></title>
<style type="text/css">
.Tools
{
width: 120px;
height: 20px;
border: solid 1px blue;
border-top:none;
padding: 2px;
margin: 4px;
color: Black;
font: normal 11.5px "Segoe UI", Arial, sans-serif;
text-align: center;
cursor: move;
display:block;
overflow:hidden;
background-image:url('RootItemBg.png');
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
onajaxrequest="RadAjaxManager1_AjaxRequest">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadPanelBar1"/>
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadPanelBar ID="RadPanelBar1" ExpandMode="SingleExpandedItem" Skin="Outlook"
runat="server">
</telerik:RadPanelBar>
<asp:HiddenField ID="myHiddenField" runat="server" />
<br />
<input id="Button1" type="button" onclick="callsvr()" value="Test" />
</div>
</form>
<script type="text/javascript">
function callsvr() {
$find("RadAjaxManager1").ajaxRequest("test");
}
</script>
</body>
</html>
My server side code
.....................................................................................................................................................................................................
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;
using System.Web.UI.HtmlControls;
namespace RadPanelBarTester
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
InitialzeToolBox();
}
}
private void InitialzeToolBox()
{
for (int i = 0; i < 5; i++)
{
RadPanelItem radItem = new RadPanelItem("TAB TEST" + i);
var motherDiv = new HtmlGenericControl("div");
motherDiv.Attributes.Add("align", "center");
for (int j = 0; j < 5; j++)
{
HtmlGenericControl childDiv = new HtmlGenericControl("div");
childDiv.Attributes.Add("class", "Tools");
childDiv.Style.Add(HtmlTextWriterStyle.ZIndex, "2");
childDiv.InnerText = "TAB TEST" + i + "Tool" + j;
childDiv.ID = "TAB TEST" + i + "Tool" + j;
motherDiv.Controls.Add(childDiv);
}
RadPanelItem itemTemplate = new RadPanelItem();
TemplateItem template = new TemplateItem(motherDiv);
itemTemplate.ItemTemplate = template;
radItem.Items.Add(itemTemplate);
RadPanelBar1.Items.Add(radItem);
}
RadPanelBar1.Items.FindItemByText("TAB TEST0").Expanded = true;
}
protected override void OnLoad(EventArgs e)
{
for (int i = 0; i < RadPanelBar1.Items.Count; i++)
{
var motherDiv = new HtmlGenericControl("div");
motherDiv.Attributes.Add("align", "center");
for (int j = 0; j < 5; j++)
{
HtmlGenericControl childDiv = new HtmlGenericControl("div");
childDiv.Attributes.Add("class", "Tools");
childDiv.InnerText = "TAB TEST" + i + "Tool" + j;
childDiv.ID = "TAB TEST" + i + "Tool" + j;
motherDiv.Controls.Add(childDiv);
}
RadPanelItem itemTemplate = new RadPanelItem();
TemplateItem template = new TemplateItem(motherDiv);
itemTemplate.ItemTemplate = template;
RadPanelBar1.Items[i].Items.Add(itemTemplate);
}
base.OnLoad(e);
}
protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
}
}
}
Template item class
............................................................................................................................................................................................
public class TemplateItem:ITemplate
{
Control control;
#region ITemplate Members
public void InstantiateIn(Control container)
{
container.Controls.Add(control);
}
#endregion
public TemplateItem(Control ctrl)
{
control = ctrl;
}
}
I am having a problem in radpanelbar particularly in IE9, The problem is whenever I made an Ajax Request using RadAjaxManager from client script. my RadPanelbar Items moves one step down automatically. Please find me the solution because I already spend LOT in this.
Here is my aspx page
................................................................................................................................................................................................................
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="RadPanelBarTester._Default" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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">
<title></title>
<style type="text/css">
.Tools
{
width: 120px;
height: 20px;
border: solid 1px blue;
border-top:none;
padding: 2px;
margin: 4px;
color: Black;
font: normal 11.5px "Segoe UI", Arial, sans-serif;
text-align: center;
cursor: move;
display:block;
overflow:hidden;
background-image:url('RootItemBg.png');
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
onajaxrequest="RadAjaxManager1_AjaxRequest">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadPanelBar1"/>
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadPanelBar ID="RadPanelBar1" ExpandMode="SingleExpandedItem" Skin="Outlook"
runat="server">
</telerik:RadPanelBar>
<asp:HiddenField ID="myHiddenField" runat="server" />
<br />
<input id="Button1" type="button" onclick="callsvr()" value="Test" />
</div>
</form>
<script type="text/javascript">
function callsvr() {
$find("RadAjaxManager1").ajaxRequest("test");
}
</script>
</body>
</html>
My server side code
.....................................................................................................................................................................................................
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;
using System.Web.UI.HtmlControls;
namespace RadPanelBarTester
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
InitialzeToolBox();
}
}
private void InitialzeToolBox()
{
for (int i = 0; i < 5; i++)
{
RadPanelItem radItem = new RadPanelItem("TAB TEST" + i);
var motherDiv = new HtmlGenericControl("div");
motherDiv.Attributes.Add("align", "center");
for (int j = 0; j < 5; j++)
{
HtmlGenericControl childDiv = new HtmlGenericControl("div");
childDiv.Attributes.Add("class", "Tools");
childDiv.Style.Add(HtmlTextWriterStyle.ZIndex, "2");
childDiv.InnerText = "TAB TEST" + i + "Tool" + j;
childDiv.ID = "TAB TEST" + i + "Tool" + j;
motherDiv.Controls.Add(childDiv);
}
RadPanelItem itemTemplate = new RadPanelItem();
TemplateItem template = new TemplateItem(motherDiv);
itemTemplate.ItemTemplate = template;
radItem.Items.Add(itemTemplate);
RadPanelBar1.Items.Add(radItem);
}
RadPanelBar1.Items.FindItemByText("TAB TEST0").Expanded = true;
}
protected override void OnLoad(EventArgs e)
{
for (int i = 0; i < RadPanelBar1.Items.Count; i++)
{
var motherDiv = new HtmlGenericControl("div");
motherDiv.Attributes.Add("align", "center");
for (int j = 0; j < 5; j++)
{
HtmlGenericControl childDiv = new HtmlGenericControl("div");
childDiv.Attributes.Add("class", "Tools");
childDiv.InnerText = "TAB TEST" + i + "Tool" + j;
childDiv.ID = "TAB TEST" + i + "Tool" + j;
motherDiv.Controls.Add(childDiv);
}
RadPanelItem itemTemplate = new RadPanelItem();
TemplateItem template = new TemplateItem(motherDiv);
itemTemplate.ItemTemplate = template;
RadPanelBar1.Items[i].Items.Add(itemTemplate);
}
base.OnLoad(e);
}
protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
}
}
}
Template item class
............................................................................................................................................................................................
public class TemplateItem:ITemplate
{
Control control;
#region ITemplate Members
public void InstantiateIn(Control container)
{
container.Controls.Add(control);
}
#endregion
public TemplateItem(Control ctrl)
{
control = ctrl;
}
}