How to save the Portlet state/position
Hi,
I had read thread http://forums.ext.net/showthread.php...hlight=Portlet in which you had suggest some line of code for save the Portlet state/position , code is working fine.
I have 10 portlets in my page the code is as follows
Code:
if (!Ext.IsAjaxRequest)
{
string text = @"Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.";
this.ScriptManager1.RegisterClientScriptBlock("text", string.Format("var text=\"{0}\";", text));
foreach (Portlet portlet in ControlUtils.FindControls<Portlet>(this.Page))
{
if (!portlet.ID.Equals("Portlet1"))
{
portlet.Html = "={text}";
}
}
}
protected void Portlet_Drop(object sender, AjaxEventArgs e)
{
string panelid = string.Empty;
string portalid = string.Empty;
string index = string.Empty;
panelid = e.ExtraParams["id"];
portalid = e.ExtraParams["parentID"];
index = e.ExtraParams["index"];
}
<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager1" runat="server" StateProvider="None" />
<ext:Portal ID="Portal1" runat="server" Border="false" BodyStyle="background-color: transparent;">
<AjaxEvents>
<Drop OnEvent="Portlet_Drop">
<ExtraParams>
<ext:Parameter Name="id" Value="e.panel.id" Mode="Raw" />
<ext:Parameter Name="parentID" Value="e.portal.id" Mode="Raw" />
<ext:Parameter Name="index" Value="e.columnIndex" Mode="Raw" />
</ExtraParams>
</Drop>
</AjaxEvents>
<Body>
<ext:ColumnLayout ID="ColumnLayout1" runat="server">
<ext:LayoutColumn ColumnWidth=".53">
<ext:PortalColumn ID="PortalColumn1" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout1" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet1" Title="Google Search" runat="server" Height="250">
<AutoLoad Url="http://www.google.com/" Mode="IFrame" />
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".43">
<ext:PortalColumn ID="PortalColumn2" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout2" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet2" Title="Panel 2" runat="server" Height="200"/>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".53">
<ext:PortalColumn ID="PortalColumn3" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout3" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet3" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".43">
<ext:PortalColumn ID="PortalColumn4" runat="server" StyleSpec="padding:10px 0 10px 0px">
<Body>
<ext:AnchorLayout ID="AnchorLayout4" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet4" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".53">
<ext:PortalColumn ID="PortalColumn5" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout5" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet5" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".43">
<ext:PortalColumn ID="PortalColumn6" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout6" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet6" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".53">
<ext:PortalColumn ID="PortalColumn7" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout7" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet7" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".43">
<ext:PortalColumn ID="PortalColumn8" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout8" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet8" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".53">
<ext:PortalColumn ID="PortalColumn9" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout9" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet9" Title="Text" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".43">
<ext:PortalColumn ID="PortalColumn11" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout11" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet11" Title="Neeraj" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".53">
<ext:PortalColumn ID="PortalColumn10" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout10" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet10" Title="Neeraj Sharma" runat="server" Height="200">
</ext:Portlet>
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
</ext:ColumnLayout>
</Body>
</ext:Portal>
</form>
I am getting columnindex, portletid fine but problem is that there is 2 column in which all the 10 portlets are shown so if I drag a portlet to 0th column to 1st column then it gives me columnindex as 0 or 1.
Now what I have to do is when I drag any control then I want to get the actual position of
portlet control means where it is dragged and where it is situated in the column after or before dragged.
If you run this code then you can find that what I want??
I had attached snap shot please see that.
Thanks in advance.
RE: How to save the Portlet state/position
Hi Neeraj Sharma,
I'm not sure I understand the functionality you are trying to accomplish, but could you use the <BeforeDrop> AjaxEvent to get the position of the Portlet before it's moved?
RE: How to save the Portlet state/position
Hi,
As I attached snap of my page in which I am using 10 portlet in 1 Portal. All the ten portlets are shown in two columns one by one. Means there is five row and each and every row has two column with two portlets.
My question is that if I drag a portlet from 0th column to first column then i get the column index 1( but it didin't give me row position), and if I drag a portlet from 0th row and 0th column to 3rd row and 1st column then I want to save its actual position that "it is dragged to 3rd row and 1st column".
I am setting all the property of portlet (like id,autoload url etc.) from database. When first time user logged into system then by default Google.com site is opened in first portlet(i.e. oth column and 0th row). Now if user dragged that portlet to 3rd row and 1st column then I want to save this new position into datatabse so that when next time user logged into system then Google.com site shown at its previously set position (I.E. 3rd row and 1st column). I want to save these two coordinates (row and column index) in database, so that next time google will be show in new position. I want to save this positions either on drag-drop event or a save button click event (Whichever is easy).
In igoogle same thing is happening and I want to do same. In igoogle if you drag wheather gadget from one position to another position then if you next time visit the site the weather control show at its last saved position where you dragged it last time, "I want to do same".
I think now you got what I want to say... Please help me out its urgent.
Thanks with anticipation of an early reply.
RE: How to save the Portlet state/position
Does the following code sample help?
Example
Code:
<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!Ext.IsAjaxRequest)
{
string text = @"Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.";
this.ScriptManager1.RegisterClientScriptBlock("text", string.Format("var text=\"{0}\";", text));
foreach (Portlet portlet in Coolite.Utilities.ControlUtils.FindControls<Portlet>(this.Page))
{
if (!portlet.ID.Equals("Portlet1"))
{
portlet.Html = "={text}";
}
}
}
}
protected void Portlet_Drop(object sender, AjaxEventArgs e)
{
this.lblID.Html = "Portlet ID: " + e.ExtraParams["id"] + "<br />";
this.lblParentID.Html = "Parent ID: " + e.ExtraParams["parentID"] + "<br />";
this.lblIndex.Html = "Column Index: " + e.ExtraParams["index"];
}
</script>
<!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>
</head>
<body>
<ext:ScriptManager ID="ScriptManager1" runat="server" />
<ext:Panel runat="server" Title="Results" Height="100">
<Body>
<ext:ContainerLayout runat="server">
<ext:Label ID="lblID" runat="server" />
<ext:Label ID="lblParentID" runat="server" />
<ext:Label ID="lblIndex" runat="server" />
</ext:ContainerLayout>
</Body>
</ext:Panel>
<ext:Portal ID="Portal1" runat="server" Border="false" BodyStyle="background-color: transparent;">
<AjaxEvents>
<Drop OnEvent="Portlet_Drop">
<ExtraParams>
<ext:Parameter Name="id" Value="e.panel.id" Mode="Raw" />
<ext:Parameter Name="parentID" Value="e.portal.id" Mode="Raw" />
<ext:Parameter Name="index" Value="e.columnIndex" Mode="Raw" />
</ExtraParams>
</Drop>
</AjaxEvents>
<Body>
<ext:ColumnLayout ID="ColumnLayout2" runat="server">
<ext:LayoutColumn ColumnWidth=".50">
<ext:PortalColumn
ID="PortalColumn12"
runat="server"
StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout12" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet1" Title="Google Search" runat="server" Height="100">
<AutoLoad Url="http://www.google.com/" Mode="IFrame" />
</ext:Portlet>
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet2" Title="Portlet 2" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet3" Title="Portlet 3" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet4" Title="Portlet 4" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet5" Title="Portlet 5" runat="server" Height="100" />
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".50">
<ext:PortalColumn ID="PortalColumn13" runat="server" StyleSpec="padding:10px 0 10px 10px">
<Body>
<ext:AnchorLayout ID="AnchorLayout13" runat="server">
<ext:Anchor>
<ext:Portlet ID="Portlet6" Title="Portlet 6" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet7" Title="Portlet 7" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet8" Title="Portlet 8" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet9" Title="Portlet 9" runat="server" Height="100" />
</ext:Anchor>
<ext:Anchor>
<ext:Portlet ID="Portlet10" Title="Portlet 10" runat="server" Height="100" />
</ext:Anchor>
</ext:AnchorLayout>
</Body>
</ext:PortalColumn>
</ext:LayoutColumn>
</ext:ColumnLayout>
</Body>
</ext:Portal>
</body>
</html>
Please note, the ColumnWidth values can not add up to more than 1.0.
RE: How to save the Portlet state/position
Hi Geoffrey
NO .... I run your suggested code, but problem is still same. I am getting column index as 0 and 1 it is fine but I dropped a portlet from 0th column 0th row to 1st column and third row. I want to save that position and if next time user visit the application then the portlet will show on its changed position.
Do you have a look at igoogle functionality. I think if you look into that... then you can understand what I want to do.
Thanks and waiting for your reply.
RE: How to save the Portlet state/position
Hi Geoffry,
I am still waiting for your reply , its urgent will you please help me.
Thanks in advance..........
Neeraj Sharma
