Aug 24, 2012, 6:03 PM
Bug rowEditor and DragTracker
Hi everyone,,
Fix the problem I had with DragTracker with gridPanel url: http://forums.ext.net/showthread.php...9160#post89160
through this: http://forums.ext.net/showthread.php...th-DragTracker
Present problems editing the plugin rowEditor, typing and not let me when I block all active rowEditor.
Ext.NET (Version 1.5)
Thank you.
Here is my code.
Fix the problem I had with DragTracker with gridPanel url: http://forums.ext.net/showthread.php...9160#post89160
through this: http://forums.ext.net/showthread.php...th-DragTracker
Present problems editing the plugin rowEditor, typing and not let me when I block all active rowEditor.
Ext.NET (Version 1.5)
Thank you.
Here is my code.
<%@ Import Namespace="System.Collections.ObjectModel" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
var store = this.GridPanel1.GetStore();
store.DataSource = new List<object>
{
new {
Name = "Bill Foot",
Email = "bill.foot@object.net",
Start = new DateTime(2007, 2, 5),
Salary = 37000,
Active = true
},
new {
Name = "Bill Little",
Email = "bill.little@object.net",
Start = new DateTime(2009, 6, 13),
Salary = 53000,
Active = true
},
new {
Name = "Bob Jones",
Email = "bob.jones@object.net",
Start = new DateTime(2008, 10, 6),
Salary = 70000,
Active = true
},
new {
Name = "Bob Train",
Email = "bob.train@object.net",
Start = new DateTime(2009, 5, 5),
Salary = 68000,
Active = true
},
new {
Name = "Fhris Johnson",
Email = "chris.johnson@object.net",
Start = new DateTime(2009, 1, 25),
Salary = 47000,
Active = true
}
};
store.DataBind();
}
}
</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>GridPanel with RowEditor Plugin - Ext.NET Examples</title>
<link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" />
<ext:XScript ID="XScript1" runat="server">
<script type="text/javascript">
var addEmployee = function () {
var grid = #{GridPanel1};
grid.getRowEditor().stopEditing();
grid.insertRecord(0, {
name : "New Guy",
email : "guy@object.net",
start : (new Date()).clearTime(),
salary : 50000,
active : true
});
grid.getView().refresh();
grid.getSelectionModel().selectRow(0);
grid.getRowEditor().startEditing(0);
};
var removeEmployee = function (e) {
var grid = GridPanel1;
grid.getRowEditor().stopEditing();
var s = grid.getSelectionModel().getSelections();
for (var i = 0, r; r = s[i]; i++) {
Store1.remove(r);
}
};
dragTrack = function (editor) {
var tracker = this,
grid = GridPanel1,
view = grid.getView(),
columns = grid.getColumnModel().config,
row,
sel,
value;
grid.getStore().each(function (record, i) {
Ext.each(columns, function (column, j) {
row = Ext.fly(view.getRow(i, j));
sel = tracker.dragRegion.isIntersect(row.getRegion());
if (sel) {
grid.getSelectionModel().selectRow(i , true);
}
record.commit();
});
});
};
</script>
</ext:XScript>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:ObjectHolder ID="divsData" runat="server" />
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="name" Mapping="Name" Type="String" />
<ext:RecordField Name="email" Mapping="Email" Type="String" />
<ext:RecordField Name="start" Mapping="Start" Type="Date" />
<ext:RecordField Name="salary" Mapping="Salary" Type="Float" />
<ext:RecordField Name="active" Mapping="Active" Type="Boolean" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:DragTracker ID="DragTracker1" runat="server">
<Listeners>
<Drag Fn="dragTrack" />
</Listeners>
</ext:DragTracker>
<ext:Window ID="Window1" runat="server" Width="600" Height="600" >
<Content>
<ext:Panel ID="Panel1" runat="server" Layout="FitLayout" >
<Content>
<ext:GridPanel ID="GridPanel1" runat="server" Width="600" Height="400" AutoExpandColumn="name"
Title="Employees" StoreID="Store1" TrackMouseOver="true">
<Listeners>
<AfterRender Handler="DragTracker1.initEl(GridPanel1.el);" />
</Listeners>
<Plugins>
<ext:RowEditor ID="RowEditor1" runat="server" SaveText="Update" >
</ext:RowEditor>
</Plugins>
<View>
<ext:GridView ID="GridView1" runat="server" MarkDirty="false" />
</View>
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:Button ID="Button1" runat="server" Text="Add Employee" Icon="UserAdd">
<Listeners>
<Click Fn="addEmployee" />
</Listeners>
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="Remove Employee" Icon="UserDelete">
<Listeners>
<Click Fn="removeEmployee" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
<ColumnModel>
<Columns>
<ext:RowNumbererColumn />
<ext:Column ColumnID="name" Header="First Name" DataIndex="name" Width="220" Sortable="true">
<Editor>
<ext:TextField ID="TextField1" runat="server" AllowBlank="false" />
</Editor>
</ext:Column>
<ext:Column Header="Email" DataIndex="email" Width="150">
<Editor>
<ext:TextField ID="TextField2" runat="server" AllowBlank="false" Vtype="email" />
</Editor>
</ext:Column>
<ext:DateColumn Header="Start Date" DataIndex="start" Format="MM/dd/yyyy" Width="100"
Sortable="true">
<Editor>
<ext:DateField ID="DateField1" runat="server" AllowBlank="false" MinDate="01.01.2006"
MinText="Can not have a start date before the Company existed." />
</Editor>
</ext:DateColumn>
<ext:NumberColumn Header="Salary" DataIndex="salary" Format="$0,0.00" Width="100"
Sortable="true">
<Editor>
<ext:NumberField ID="NumberField1" runat="server" AllowBlank="false" MinValue="1"
MaxValue="150000" />
</Editor>
</ext:NumberColumn>
<ext:BooleanColumn Header="Active" DataIndex="active" Align="Center" Width="50" TrueText="Yes"
FalseText="No">
<Editor>
<ext:Checkbox ID="Checkbox1" runat="server" />
</Editor>
</ext:BooleanColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</Content>
</ext:Panel>
</Content>
</ext:Window>
</form>
</body>
</html>