Apr 30, 2012, 9:32 AM
[CLOSED] South Panel rendering issue after gridPanel row select
Hi,
We implemented a gridPanel hanving a RowSelect listener to expand south panel and to load south panel content with a [FormPanel implemented programmatically].
We reproduced the issue in the code implemented bellow :
GridPanel ascx code :
We implemented a gridPanel hanving a RowSelect listener to expand south panel and to load south panel content with a [FormPanel implemented programmatically].
We reproduced the issue in the code implemented bellow :
GridPanel ascx code :
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:Panel ID="Panel1" runat="server" Height="250">
<Items>
<ext:ColumnLayout ID="_columnLayoutProfileGrid" runat="server" FitHeight="true">
<Columns>
<ext:LayoutColumn ColumnWidth="0.5">
<ext:GridPanel ID="_groupGrid" ClientIDMode="Static" runat="server" EnableDragDrop="false"
AutoExpandColumn="_groupShortName" AutoDoLayout="true">
<View>
<ext:GridView ID="_gridViewGroup" runat="server" ForceFit="true" />
</View>
<Store>
<ext:Store ID="_dsUsrGroup" runat="server" AutoLoad="true">
<Proxy>
<ext:HttpProxy Url="/Research/GetGroupsList" />
</Proxy>
<Reader>
<ext:JsonReader IDProperty="GroupId" Root="data" TotalProperty="total">
<Fields>
<ext:RecordField Name="GroupId">
</ext:RecordField>
<ext:RecordField Name="GoupName">
</ext:RecordField>
<ext:RecordField Name="Supervisor">
</ext:RecordField>
</Fields>
</ext:JsonReader>
</Reader>
<BaseParams>
<ext:Parameter Name="limit" Value="15" Mode="Raw" />
<ext:Parameter Name="start" Value="0" Mode="Raw" />
</BaseParams>
</ext:Store>
</Store>
<ColumnModel ID="_columnModelGroupGrid" runat="server">
<Columns>
<ext:Column ColumnID="_groupId" Header="Id" DataIndex="GroupId" />
<ext:Column ColumnID="_groupShortName" Header="Group Shortname" DataIndex="GoupName">
</ext:Column>
<ext:CheckColumn ColumnID="_groupSupervisor" DataIndex="Supervisor" Header="Supervisor"
Editable="true" Hidden="true">
</ext:CheckColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="_rowSelectionModelGroupGrid" runat="server" SingleSelect="true">
<Listeners>
<RowSelect Handler="showSouthPanel();" />
</Listeners>
</ext:RowSelectionModel>
</SelectionModel>
<BottomBar>
<ext:PagingToolbar ID="_pagingToolbarGroupGrid" runat="server" PageSize="15" />
</BottomBar>
<LoadMask ShowMask="true" />
</ext:GridPanel>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Items>
</ext:Panel>
Partial that loads FormPanelView: <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:Panel ID="_pnlForm" runat="server" Border="false" Header="false" Layout="FitLayout">
<AutoLoad Url="/Research/LoadFP" NoCache="true">
<Params>
<ext:Parameter Name="containerID" Value="#{_pnlForm}" Mode="Value" />
</Params>
</AutoLoad>
</ext:Panel>
ASPX code that loads gridPanel and formPanelView : <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html>
<head runat="server">
<script type="text/javascript">
var showSouthPanel = function () {
Ext.get("_pnlSouthForm").load(
{
url: "/Research/FormPanelView?containerID=_pnlSouthForm",
text: "loading",
scripts: true
}
);
_pnlSouthForm.expand();
};
</script>
</head>
<ext:ResourceManager runat="server">
</ext:ResourceManager>
<body>
<ext:Viewport runat="server" Layout="BorderLayout">
<Items>
<ext:Panel runat="server" ID="_gridPnl" Border="false" Header="false" Region="Center">
<AutoLoad Url="/Research/Grid1" NoCache="true">
<Params>
<ext:Parameter Name="containerID" Value="#{_gridPnl}" Mode="Value" />
</Params>
</AutoLoad>
</ext:Panel>
<ext:Panel ID="_pnlSouthForm" runat="server" Border="false" Header="false" Region="South"
AutoScroll="true" Height="250" Collapsible="true" Collapsed="true" TitleCollapse="true">
</ext:Panel>
</Items>
</ext:Viewport>
</body>
</html>
Controller Code : using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Ext.Net.MVC;
using Ext.Net;
using System.Collections.ObjectModel;
using System.Data;
namespace Presentation.Controllers
{
public class Group
{
int groupId;
public int GroupId
{
get { return groupId; }
set { groupId = value; }
}
String goupName;
public String GoupName
{
get { return goupName; }
set { goupName = value; }
}
private Boolean supervisor;
public Boolean Supervisor
{
get { return supervisor; }
set { supervisor = value; }
}
}
public class ResearchController : Controller
{
public AjaxStoreResult GetGroupsList()
{
List<Group> groups = new List<Group>();
Group group = new Group();
group.GroupId = 1;
group.GoupName = "Group";
groups.Add(group);
Group group2 = new Group();
group2.GroupId = 2;
group2.GoupName = "Group 2";
groups.Add(group2);
AjaxStoreResult result = new AjaxStoreResult();
result.Data = groups;
return result;
}
public ActionResult Grid1(String containerID)
{
Ext.Net.MVC.PartialViewResult pr = new Ext.Net.MVC.PartialViewResult(containerID);
pr.RenderMode = RenderMode.AddTo;
pr.SingleControl = true;
return pr;
}
public ActionResult Research()
{
return View();
}
public FormPanel CreateFP()
{
FormPanel fp = new FormPanel();
fp.ID = "_fp";
TextField txtField = new TextField();
txtField.FieldLabel = "Txt";
txtField.Text = "test";
Button btn = new Button();
btn.Text = "click";
btn.ID = "_btn";
fp.Items.Add(txtField);
fp.Items.Add(btn);
return fp;
}
public ContentResult LoadFP(String containerID)
{
ContentResult cr = new ContentResult();
cr.Content = string.Format("<script>{0}</script>",
CreateFP().ToScript(
RenderMode.AddTo,
containerID));
return cr;
}
public ActionResult FormPanelView(String containerID)
{
Ext.Net.MVC.PartialViewResult pr = new Ext.Net.MVC.PartialViewResult(containerID);
pr.RenderMode = RenderMode.AddTo;
pr.SingleControl = true;
return pr;
}
}
}
Thank you in advance.
Last edited by Daniil; May 01, 2012 at 9:48 AM.
Reason: [CLOSED]