Dec 12, 2013, 4:42 AM
How to get Position of panel in column layout..
<ext:Container ID="Container6" runat="server" Layout="ColumnLayout">
<Items>
<ext:Container ID="Container7" runat="server" Cls="dropable" Layout="Fit" Height="100"
PaddingSpec="5 5 5 5" ColumnWidth="0.3">
<Items>
<ext:Panel ID="Panel1" runat="server" Cls="draggable" Title="Politics" />
</Items>
</ext:Container>
<ext:Container ID="Container10" runat="server" Cls="dropable" Layout="Fit" Height="100"
PaddingSpec="5 5 5 5" ColumnWidth="0.3">
<Items>
<ext:Panel ID="Panel9" runat="server" Cls="draggable" Title="BSE" />
</Items>
</ext:Container>
<ext:Container ID="Container11" runat="server" Cls="dropable" Layout="Fit" ColumnWidth="0.4"
PaddingSpec="5 5 5 5" Height="100">
<Items>
<ext:Panel ID="Panel10" runat="server" Cls="draggable" Title="Sports" BodyPadding="5" />
</Items>
</ext:Container>
<ext:Container ID="Container5" runat="server" Cls="dropable" Layout="Fit" Height="100"
PaddingSpec="5 5 5 5" ColumnWidth="0.3">
<Items>
<ext:Panel ID="Panel4" runat="server" Cls="draggable" Title="Electronics" />
</Items>
</ext:Container>
<ext:Container ID="Container8" runat="server" Cls="dropable" Layout="Fit" Height="100"
PaddingSpec="5 5 5 5" ColumnWidth="0.3">
<Items>
<ext:Panel ID="Panel5" runat="server" Cls="draggable" Title="South" />
</Items>
</ext:Container>
<ext:Container ID="Container9" runat="server" Cls="dropable" Layout="Fit" ColumnWidth="0.4"
PaddingSpec="5 5 5 5" Height="100">
<Items>
<ext:Panel ID="Panel7" runat="server" Cls="draggable" Title="Center" BodyPadding="5" />
</Items>
</ext:Container>
</Items>
</ext:Container>
Script <script>
var notifyDrop = function (source, e, data) {
var targetCt = Ext.getCmp(this.el.dom.id),
targetPanel = targetCt.items.get(0),
sourceCt = data.panel.ownerCt;
sourceCt.add(targetPanel);
targetCt.add(data.panel);
Ext.defer(function () {
targetPanel.doLayout();
data.panel.doLayout();
}, 1);
};
var startDrag = function () {
Ext.select(".dropable").addCls("x-drop-marker");
Ext.select(".draggable").hide();
this.panelProxy.moveOnDrag = false;
};
var endDrag = function () {
Ext.select(".dropable").removeCls("x-drop-marker");
Ext.select(".draggable").show();
Ext.panel.DD.prototype.endDrag.apply(this, arguments);
};
</script>
And this is code behind protected void Page_Load(object sender, EventArgs e)
{
foreach (Container region in Container6.Items)
{
Ext.Net.Panel p = (Ext.Net.Panel)region.Items[0];
p.DraggablePanelConfig = new DragSource
{
Group = "panelDD",
StartDrag =
{
Fn = "startDrag"
},
EndDrag =
{
Fn = "endDrag"
}
};
}
}
Am tried to make home page with gadgets.Every user have different gadgets and different positions as they wish.Here is the my stuff.Am trying to get position of panel after some drag and drop moves.
Once the user saved the gadgets with that positions again after login i have to show the gadgets with that same positions
please can any one suggest how to get position of panel.
Last edited by antoreegan; Dec 12, 2013 at 5:05 AM.