Hai Daniil,
I'm still confused here.. :p
i used your example to learn drag n drop concept. If i want to build a function to check if in gridview2 have a value then i can drop it, but if not have it can't dropped. How to do that ? I used Dragdrop Zone plugin like i post above, but isn't work.
This is my source from your example :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="dragdropgrid.aspx.cs" Inherits="belajarExt.dragdropgrid" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
Store store = this.GridPanel1.GetStore();
store.DataSource = new object[]
{
new object[] { "test", "test" },
new object[] { "test", "test" },
new object[] { "test", "test" }
};
store = this.GridPanel2.GetStore();
store.DataSource = new object[]
{
new object[] { "1", "1" },
new object[] { "1", "1" },
new object[] { "1", "1" }
};
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Ext.NET v2 Example</title>
<script type="text/javascript">
var onNodeEnter = function (target, dd, e, dragData) {
delete this.dropOK;
if (!target) {
return;
}
alert(this.dropOK);
// var f = dragData.field;
// if (!f) {
// return;
// }
// var type = target.record.fields.get(target.fieldName).type;
// switch (type) {
// case Ext.data.Types.FLOAT:
// case Ext.data.Types.INT:
// if (!f.isXType("numberfield")) {
// return;
// }
// break;
// case Ext.data.Types.DATE:
// if (!f.isXType("datefield")) {
// return;
// }
// break;
// case Ext.data.Types.BOOL:
// if (!f.isXType("checkbox")) {
// return;
// }
// }
this.dropOK = true;
Ext.fly(target.node).addCls("x-drop-target-active");
};
var onNodeOver = function (target, dd, e, dragData) {
alert("here");
return this.dropOK ? this.dropAllowed : this.dropNotAllowed;
};
</script>
<style>
.myСlass {
}
</style>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="test1" />
<ext:ModelField Name="test2" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" Text="Test 1" DataIndex="test1" />
<ext:Column ID="Column2" runat="server" Text="Test 2" DataIndex="test2" />
</Columns>
</ColumnModel>
<View>
<ext:GridView ID="GridView1" runat="server">
<Plugins>
<ext:CellDragDrop ID="CellDragDrop1" runat="server" EnableDrop="false" />
</Plugins>
</ext:GridView>
</View>
</ext:GridPanel>
<ext:GridPanel ID="GridPanel2" runat="server">
<Store>
<ext:Store ID="Store2" runat="server">
<Model>
<ext:Model ID="Model2" runat="server">
<Fields>
<ext:ModelField Name="test3" />
<ext:ModelField Name="test4" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:Column ID="Column3" runat="server" Text="Test 1" DataIndex="test3" />
<ext:Column ID="Column4" runat="server" Text="Test 2" DataIndex="test4" />
</Columns>
</ColumnModel>
<View>
<ext:GridView ID="GridView2" runat="server">
<Plugins>
<ext:CellDragDrop ID="CellDragDrop2" runat="server" EnableDrag="false" />
</Plugins>
</ext:GridView>
</View>
</ext:GridPanel>
<ext:DropZone ID="DropZone1" runat="server" Target="{#(GridView2).view.el)">
<OnNodeOver Fn="onNodeOver" />
<OnNodeEnter Fn="onNodeEnter" />
<%--<OnNodeOut Fn="onNodeOut" />
<OnNodeDrop Fn="" />--%>
</ext:DropZone>
</form>
</body>
</html>
in that code i want to check if the javascript function has fire when i drag on grid1 and pass to grid 2. then if the function event fire then i want to build a function to check if that drop zone cell has value or not.
Thanks :)