Jun 16, 2017, 9:51 PM
[CLOSED] Missing null check on cell (4.2.1)
Support,
Please add a null check here. i cant always replicate but this occurs when to drag it, but your selection of the cell is like on a column line. you can cause the cell to be null.
I found this also on 3.2.1. The JS error then causes a host of other issues such as loaders not firing.
To replicate this
1. load page.
2. paginate to page two.
3. starting at the 3-4 row, drag a cell diagonally to the right (and down).
4. where you release it, click again and drag diagonally to the left (and down)
5. just zigzag all the way down to the bottom until error shows
(if it doesnt show, just paginate to next page and try again.
(steps 3-5 doesnt be done very fast)
thanks,
/Z
ext.net code
aspx
class
This is the error!
SCRIPT5007: Unhandled exception at line 278, column 25 in http://localhost:57958/ta/WebResourc...32194011381635
0x800a138f - JavaScript runtime error: Unable to get property 'textContent' of undefined or null reference
Please add a null check here. i cant always replicate but this occurs when to drag it, but your selection of the cell is like on a column line. you can cause the cell to be null.
I found this also on 3.2.1. The JS error then causes a host of other issues such as loaders not firing.
To replicate this
1. load page.
2. paginate to page two.
3. starting at the 3-4 row, drag a cell diagonally to the right (and down).
4. where you release it, click again and drag diagonally to the left (and down)
5. just zigzag all the way down to the bottom until error shows
(if it doesnt show, just paginate to next page and try again.
(steps 3-5 doesnt be done very fast)
thanks,
/Z
ext.net code
Ext.define('Ext.ux.CellDragDrop', {
override: 'Ext.ux.CellDragDrop',
notSupportedText: "The cell from a Column without a DataIndex cannot be used for drag&drop",
// This whole block needed to be reproduced in order to add bugfixes for
// github issue #899.
onViewRender: function (view) {
var me = this,
scrollEl;
if (me.enableDrag) {
if (me.containerScroll) {
scrollEl = view.getEl();
}
me.dragZone = new Ext.view.DragZone({
view: view,
ddGroup: me.dragGroup || me.ddGroup,
dragText: me.dragText,
containerScroll: me.containerScroll,
scrollEl: scrollEl,
notSupportedText: me.notSupportedText, // #899
getDragData: function (e) {
var view = this.view,
item = e.getTarget(view.getItemSelector()),
record = view.getRecord(item),
cell = e.getTarget(view.getCellSelector()),
dragEl, header;
if (item) {
dragEl = document.createElement('div');
dragEl.className = 'x-form-text';
dragEl.appendChild(document.createTextNode(cell.textContent || cell.innerText));
header = view.getHeaderByCell(cell);
return {
event: new Ext.EventObjectImpl(e),
ddel: dragEl,
item: e.target,
columnName: header.dataIndex,
record: record
};
}
},
aspx
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head id="Head" runat="server">
<title>Search </title>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.GridPanelTest.Store.Primary.DataSource = Enumerable.Range(0, 1000).Select(i => new object[]
{
i,
i,
i
});
this.GridPanelTest.Store.Primary.DataBind();
}
}
</script>
<script type="text/javascript">
var commandHandler = function (cmd, data, grid, record) {
};
var onAfterRenderDragAndDrop = function (view) {
var cellDragDrop;
Ext.Array.each(view.getPlugins()[0], function (plugin) {
if (plugin instanceof Ext.ux.CellDragDrop) {
cellDragDrop = plugin;
return false;
}
});
if (cellDragDrop.dragZone) {
cellDragDrop.dragZone.onBeforeDrag = function (data, e) {
if (!data.columnName) { // It means no DataIndex
return false;
}
}
}
};
var notifyOver2 = function (ddSource, e, data) {
return this.dropAllowed;
};
var notifyDrop2 = function (ddSource, e, data) {
return true;
};
var prepareCreate1 = function (grid, toolbar, rowIndex, record) {
var firstButton = toolbar.items.get(0);
if (record.data.startTestData.indexOf('N') >= 0) {
firstButton.setVisible(true);
} else {
firstButton.setVisible(false);
}
};
</script>
</head>
<body>
<form id="FormSearch" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server"/>
<ext:DropTarget ID="DropTarget2"
runat="server"
Target="={Ext.getCmp('GridPanelTest').getView()}"
Group="ddGroup" >
<NotifyDrop Fn="notifyDrop2" />
<NotifyOver Fn="notifyOver2" />
</ext:DropTarget>
<ext:Viewport ID="Viewport1" runat="server" Layout="FitLayout">
<Items>
<ext:GridPanel
ID="GridPanelTest"
runat="server"
Title="Test Defect"
Layout="FitLayout">
<Store>
<ext:Store ID="StoreTest"
runat="server"
RemoteSort="false"
AutoLoad="false"
>
<Proxy>
<ext:AjaxProxy Url="/ta/Support/GetData/" Timeout="60000" >
<ActionMethods READ="GET" />
<Reader>
<ext:JsonReader IDProperty="id" RootProperty="data" TotalProperty="total"/>
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model ID="Model1" IDProperty="id" runat="server">
<Fields>
<ext:ModelField Name="id" Type="Int" />
<ext:ModelField Name="startTestData" Type="String" />
<ext:ModelField Name="endTestData" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModelSea" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" Text="Time In" DataIndex="startTestData" >
<Editor>
<ext:TextField ID="TextField1" runat="server" />
</Editor>
</ext:Column>
<ext:Column ID="Column2" runat="server" Text="Time Out" DataIndex="endTestData">
<Editor>
<ext:TextField ID="TextField2" runat="server" />
</Editor>
</ext:Column>
<ext:CommandColumn ID="CommandColumn1" runat="server" Width="35">
<Commands>
<ext:GridCommand CommandName="Create1" Icon="CalendarAdd">
<ToolTip Text="Create 1" />
</ext:GridCommand>
</Commands>
<PrepareToolbar Fn="prepareCreate1" />
<Listeners>
<Command Handler="commandHandler(command, record.data, GridPanelTest, record);" />
</Listeners>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CellSelectionModel ID="CellSelectionModel1" runat="server" />
</SelectionModel>
<Plugins>
<ext:CellEditing ID="CellEditing1" Enabled="true" ClicksToEdit="1" runat="server" />
</Plugins>
<View>
<ext:GridView ID="GridView7" runat="server" StripeRows="true">
<Plugins>
<ext:CellDragDrop ID="CellDragDrop1" runat="server" ApplyEmptyText="true" EnforceType="true" DDGroup="ddGroup" />
</Plugins>
<Listeners>
<AfterRender Fn="onAfterRenderDragAndDrop" />
</Listeners>
</ext:GridView>
</View>
<BottomBar>
<ext:PagingToolbar ID="PagingToolbar1"
runat="server"
DisplayInfo="true"
DisplayMsg="Displaying results {0} - {1} of {2}"
EmptyMsg="No results to display">
<Items>
<ext:Button runat="server" Text="load">
<Listeners>
<Click Handler="App.GridPanelTest.getStore().reload();" />
</Listeners>
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="test">
<Listeners>
<Click Handler="App.StoreTest.getAt(1).set('endTestData', '5');" />
</Listeners>
</ext:Button>
<ext:Button ID="ButtonSaveExceptionPunches" runat="server" Text="Save" Icon="Disk">
<ToolTips>
<ext:ToolTip ID="ToolTip8" runat="server" Title="Save Timecard" Html="Click to Save your timecard data updates" />
</ToolTips>
<DirectEvents>
<Click
Url="/ta/Support/SaveData/"
Timeout="240000"
CleanRequest="true"
Method="POST">
<ExtraParams>
<ext:Parameter Name="data" Value="#{StoreTest}.getChangedData()" Mode="Raw" Encode="true" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:PagingToolbar>
</BottomBar>
</ext:GridPanel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
controller public DirectResult SaveData(string id, FormCollection values, string startDate, string endDate)
{
DirectResult response = new DirectResult();
Ext.Net.Store store = X.GetCmp<Ext.Net.Store>("StoreTest");
StoreDataHandler dataHandler = new StoreDataHandler(values["data"]);
ChangeRecords<TestData> data = dataHandler.BatchObjectData<TestData>();
for (int i = 0; i < data.Updated.Count; i++)
{
TestData testData = data.Updated[i];
//we want to remove the record since it is processed so we use the delete record option
ModelProxy record = store.GetById(testData.id);
store.Remove(record);
store.CommitRemoving(testData.id);
}
return response;
}
public ActionResult GetData()
{
List<TestData> l = new List<TestData>();
for (int i = 0; i < 2000; i++)
{
TestData t = new TestData();
t.id = i;
t.startTestData = "test_" + i;
t.endTestData = "test_" + i;
l.Add(t);
}
var query = l.Select(dt => new
{
id = dt.id,
startTestData = dt.startTestData,
endTestData = dt.endTestData
}).OrderBy(d => d.id);
return this.Store(query);
}
class
public class TestData
{
public long id;
public string startTestData;
public string endTestData;
}
This is the error!
SCRIPT5007: Unhandled exception at line 278, column 25 in http://localhost:57958/ta/WebResourc...32194011381635
0x800a138f - JavaScript runtime error: Unable to get property 'textContent' of undefined or null reference
Last edited by fabricio.murta; Jun 27, 2017 at 1:46 PM.