View Full Version : Grid panel marking records
harvca
Aug 09, 2021, 1:13 AM
Could I please get an example on how to mark records in a Grid panel for Ext.NET v7.2?
I can not seem to workout how to update the v5.3 example.
Thank you.
fabricio.murta
Aug 10, 2021, 3:19 AM
Hello @harvca, and welcome to Ext.NET Forums!
Can you point the exact v5.3 example you're talking about? All you'd need is to see how to make that example in v7?
Looking forward to your follow-up!
harvca
Aug 10, 2021, 6:45 AM
Hi @fabricio.murta
Here is the v5.3 example https://examples5.ext.net/#/GridPanel/Miscellaneous/Marking_Records/
Yes all I need is how to do this in v7.
To give some more context I am currently porting a .NET 4.6 (Ext.NET v2.5) app to .NET 5 (Ext.NET v7.2).
fabricio.murta
Aug 10, 2021, 8:32 PM
Hello again, @harvca!
Thanks for the clarifications. Here you go:
- t63178_markRecords.cshtml
@page
@model ExtNet7WebPages_NuGet.Pages.Forums._6._3._0_2.t631 78_markRecordsModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>
63178 - Grid Panel > Miscellaneous > Marking Records
</title>
<style type="text/css">
.dirty-row .x-grid-cell, .dirty-row .x-grid-rowwrap-div {
background-color: #FFFDD8 !important;
}
.new-row .x-grid-cell, .new-row .x-grid-rowwrap-div {
background: #c8ffc8 !important;
}
</style>
<script type="text/javascript">
var getRowClass = function (record) {
if (record.phantom) {
return "new-row";
}
if (record.dirty) {
return "dirty-row";
}
};
var insertRecord = function () {
var grid = App.GridPanel1;
grid.store.insert(0, {});
grid.getView().focusRow(0);
grid.editingPlugin.startEdit(grid.store.getAt(0), grid.columns[0]);
};
</script>
</head>
<body>
<h1>
Grid Panel > Miscellaneous > Marking Records
</h1>
<p>Demonstrates how to mark rows with custom colors. Edit any cell or insert new record.</p>
<ext-gridPanel id="GridPanel1" title="Test Grid" width="600" height="350">
<store>
<ext-store data="Model.GridData">
<model>
<ext-model idProperty="TestCell">
<fields>
<ext-dataField name="TestCell" />
</fields>
</ext-model>
</model>
</ext-store>
</store>
<columns>
<ext-column text="TestCell" dataIndex="TestCell" flex="1" editor="textfield" />
</columns>
<viewConfig>
<ext-tableView x-xtype="gridview">
<customConfig>
<ext-add key="getRowClass" value="getRowClass" mode="Raw" />
</customConfig>
</ext-tableView>
</viewConfig>
<plugins>
<ext-cellEditingPlugin clicksToEdit="1">
<listeners>
<edit handler="editor.grid.getView().refresh();" />
</listeners>
</ext-cellEditingPlugin>
</plugins>
<buttons>
<ext-button text="Insert record" iconCls="x-md md-icon-add">
<listeners>
<click fn="insertRecord" />
</listeners>
</ext-button>
</buttons>
</ext-gridPanel>
</body>
</html>
- t63178_markRecords.cshtml.cs
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace ExtNet7WebPages_NuGet.Pages.Forums._6._3._0_2
{
public class t63178_markRecordsModel : PageModel
{
public List<object> GridData
{
get
{
var data = new List<object>();
for (var i = 1; i <= 15; i++)
{
data.Add(new object[] { "Sample " + i });
}
return data;
}
}
public void OnGet()
{
}
}
}
Hope this helps!
Powered by vBulletin® Version 4.2.3 Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.