Oct 07, 2013, 10:37 AM
disabled window is opened.
Hello Sir,
I am facing model window popup issue.
How produce the issue.
1. Click on "Open 1 Win" button. a popup will open.
2. Drag drop items from Left grid panel to right grid panel. then double click on Open Window button of right grid panel. a popup window will open with close button option. close the window by using close button.
3. then again double click on open window button of right grid panel. a popup window will open. close the window by using close button.
4. repeat step 3 2-3 times.
please see the following image.
After some R&D, I found that If I remove notify message from following code. above issue is fixed. but I need notify message.
Rupesh
I am facing model window popup issue.
How produce the issue.
1. Click on "Open 1 Win" button. a popup will open.
2. Drag drop items from Left grid panel to right grid panel. then double click on Open Window button of right grid panel. a popup window will open with close button option. close the window by using close button.
3. then again double click on open window button of right grid panel. a popup window will open. close the window by using close button.
4. repeat step 3 2-3 times.
please see the following image.
After some R&D, I found that If I remove notify message from following code. above issue is fixed. but I need notify message.
[DirectMethod(Namespace = "CompanyX")]
public void SetDropDrag(string myopt)
{
X.Msg.Notify("Message", "Data Saved Successfully").Show();
FillData();
}
Please guide me.<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DragDropWindowDisabled.aspx.cs" Inherits="DragDropWindowDisabled" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Drag and Drop from GridPanel to GridPanel - Ext.NET Examples</title>
<ext:xscript id="XScript1" runat="server">
<script type="text/javascript">
// Generic function to add records.
var addRow = function (store, record, ddSource) {
// Search for duplicates
var foundItem = store.findExact('Name', record.data.Name);
// if not found
if (foundItem == -1) {
//Remove Record from the source
ddSource.grid.store.remove(record);
store.add(record);
// Call a sort dynamically
store.sort('Name', 'ASC');
}
};
var notifyDrop1 = function (ddSource, e, data) {
// Loop through the selections
Ext.each(ddSource.dragData.selections, function (record) {
addRow(Store1, record, ddSource);
});
return true;
};
var notifyDrop2 = function (ddSource, e, data) {
// Loop through the selections
Ext.each(ddSource.dragData.selections, function (record) {
addRow(Store2, record, ddSource);
});
return true;
};
//---Commnon function for drop zones
var onContainerOver = function (dz, grid, dd, e, data) {
return dz.dropAllowed;
};
var onContainerDrop = function (grid, dd, e, data) {
if (dd.grid !== grid) {
grid.store.add(data.selections);
CompanyX.SetDropDrag(data.selections[0].data.Name);
return true;
} else {
var index = dd.grid.getView().findRowIndex(e.target),
store = dd.grid.getStore();
store.remove(dd.dragData.selections);
index = index > store.getCount() ? store.getCount() : index;
store.insert(index, dd.dragData.selections);
CompanyX.SetReorder(dd.dragData.selections[0].data.CoachPlanWorkID, index);
return true;
}
};
</script>
</ext:xscript>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>Drag and Drop from GridPanel to GridPanel</h1>
<p>This example shows how to setup two way drag and drop from one GridPanel to another.</p>
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="Name" />
<ext:RecordField Name="Column1" />
<ext:RecordField Name="Column2" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Store ID="Store2" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="Name" />
<ext:RecordField Name="Column1" />
<ext:RecordField Name="Column2" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Button runat="server" Text="Open 1 Win">
<DirectEvents>
<Click OnEvent="Open1Win"></Click>
</DirectEvents>
</ext:Button>
<ext:Window runat="server" ID="win1" Hidden="true" Height="500" Width="800">
<Items>
<ext:Panel ID="Panel1" runat="server" Width="650" Height="300">
<Items>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<West MarginsSummary="5 5 5 5">
<ext:GridPanel
ID="GridPanel1"
runat="server"
DDGroup="secondGridDDGroup"
StoreID="Store1"
EnableDragDrop="true"
StripeRows="true"
AutoExpandColumn="Name"
Width="325"
Title="Left">
<ColumnModel>
<Columns>
<ext:Column ColumnID="Name" Header="Record Name" Width="160" DataIndex="Name" />
<ext:Column Header="Column 1" Width="60" DataIndex="Column1" />
<ext:Column Header="Column 2" Width="60" DataIndex="Column2" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
</ext:GridPanel>
</West>
<Center MarginsSummary="5 5 5 0">
<ext:GridPanel
ID="GridPanel2"
runat="server"
DDGroup="firstGridDDGroup"
StoreID="Store2"
EnableDragDrop="true"
StripeRows="true"
AutoExpandColumn="Name"
Width="325"
Title="Right">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button Text="open Window" runat="server" Icon="Add">
<DirectEvents>
<Click OnEvent="OpenWindow">
<EventMask ShowMask="true" />
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<ColumnModel>
<Columns>
<ext:Column ColumnID="Name" Header="Record Name" Width="160" DataIndex="Name" />
<ext:Column Header="Column 1" Width="60" DataIndex="Column1" />
<ext:Column Header="Column 2" Width="60" DataIndex="Column2" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel2" runat="server" />
</SelectionModel>
</ext:GridPanel>
</Center>
</ext:BorderLayout>
</Items>
<BottomBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:ToolbarFill ID="ToolbarFill1" runat="server" />
<ext:Button ID="Button1" runat="server" Text="Reset">
<Listeners>
<Click Handler="Store1.loadData(Store1.proxy.data); Store2.removeAll();" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:Panel>
</Items>
</ext:Window>
<ext:dropzone id="DropZone2" runat="server" target="={#{GridPanel2}.view.scroller.dom}"
group="secondGridDDGroup" containerscroll="true" >
<oncontainerdrop handler="return onContainerDrop(#{GridPanel2}, source, e, data);" />
<oncontainerover handler="return onContainerOver(this, #{GridPanel2}, source, e, data);" />
<%--<NotifyDrop Fn="notifyDropN" />--%>
</ext:dropzone>
<%-- <ext:DropTarget ID="DropTarget1" runat="server" Target="={GridPanel1.view.scroller.dom}" Group="firstGridDDGroup">
<NotifyDrop Fn="notifyDrop1" />
</ext:DropTarget>
<ext:DropTarget ID="DropTarget2" runat="server" Target="={GridPanel2.view.scroller.dom}" Group="secondGridDDGroup">
<NotifyDrop Fn="notifyDrop2" />
</ext:DropTarget> --%>
<ext:Window runat="server" ID="win" Title="Test Window" Hidden="true" Width="300" Height="300">
<Content>
Welcome to popup Window.
</Content>
<Buttons>
<ext:Button runat="server" Text="close">
<DirectEvents>
<Click OnEvent="CloseWindow">
</Click>
</DirectEvents>
</ext:Button>
</Buttons>
<DirectEvents>
<Hide OnEvent="ReloadGrid"></Hide>
</DirectEvents>
</ext:Window>
</div>
</form>
</body>
</html>
Following is the code behind sampleusing System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;
public partial class DragDropWindowDisabled : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
FillData();
}
}
protected void OpenWindow(object sender, DirectEventArgs e)
{
win.Hidden = false;
win.Modal = true;
}
protected void CloseWindow(object sender, DirectEventArgs e)
{
win.Hidden = true;
win.Modal = false;
}
protected void ReloadGrid(object sender, DirectEventArgs e)
{
FillData();
}
protected void Open1Win(object sender, DirectEventArgs e)
{
win1.Hidden = false;
win1.Modal = true;
}
private void FillData()
{
List<object> data = new List<object>();
for (int i = 0; i < 10; i++)
{
data.Add(new
{
Name = "Rec " + i,
Column1 = i.ToString(),
Column2 = i.ToString()
});
}
this.Store1.DataSource = data;
this.Store1.DataBind();
List<object> data1 = new List<object>();
for (int i = 0; i < 3000; i++)
{
data.Add(new
{
Name = "Rec " + i,
Column1 = i.ToString(),
Column2 = i.ToString()
});
}
this.Store2.DataSource = data;
this.Store2.DataBind();
}
[DirectMethod(Namespace = "CompanyX")]
public void SetDropDrag(string myopt)
{
X.Msg.Notify("Message", "Data Saved Successfully").Show();
FillData();
}
}
ThanksRupesh