Hi Fabricio,
I have put together example with sample data, etc. It can be put in Visual studio and run as a stand alone app. Please take a look (You should see the ID of the status instead of the description in the combobox field on the far right):
Test.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="LateralTransfer.Test" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" />
<asp:ScriptManager runat="server" EnablePageMethods="true" EnablePartialRendering="true">
<Scripts>
<asp:ScriptReference Path="~/Scripts/ExtNet/PageFunctions.js" />
</Scripts>
</asp:ScriptManager>
<h1>Editable GridPanel With Save To [DirectMethod]</h1>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Editable GridPanel"
Width="700"
Height="350">
<Store>
<ext:Store runat="server">
<Model>
<ext:Model runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" Type="Int" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Number" />
<ext:ModelField Name="Note" />
<ext:ModelField Name="NumberNew" />
<ext:ModelField Name="NameNew" />
<ext:ModelField Name="Note" />
<ext:ModelField Name="TransferStatus_ID" Type="Int" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="ID" DataIndex="ID" Width="35" />
<ext:Column runat="server" Text="Name" DataIndex="Name" Flex="1">
</ext:Column>
<ext:Column runat="server" Text="Number" DataIndex="Number" Flex="1">
</ext:Column>
<ext:Column runat="server" Text="Name New" DataIndex="NameNew" Flex="1">
<Editor>
<ext:TextField runat="server" />
</Editor>
</ext:Column>
<ext:Column runat="server" Text="Number New" DataIndex="NumberNew" Flex="1">
<Editor>
<ext:TextField runat="server" />
</Editor>
</ext:Column>
<ext:Column runat="server" Text="Note" DataIndex="Note" Flex="1">
<Editor>
<ext:TextField runat="server" />
</Editor>
</ext:Column>
<ext:Column runat="server" DataIndex="TransferStatus_ID" Text="Status Select" Width="200">
<Editor>
<ext:ComboBox ID="cbStatuses" runat="server" />
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CellSelectionModel runat="server" />
</SelectionModel>
<Plugins>
<ext:CellEditing runat="server">
<Listeners>
<Edit Fn="edit" />
</Listeners>
</ext:CellEditing>
</Plugins>
</ext:GridPanel>
</form>
</body>
</html>
Test.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net;
namespace LateralTransfer
{
public partial class Test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
LoadStatuses();
if (!X.IsAjaxRequest)
{
this.BindData();
}
}
private void LoadStatuses()
{
this.cbStatuses.Items.Add(new Ext.Net.ListItem("Pending", 1));
this.cbStatuses.Items.Add(new Ext.Net.ListItem("Accepted", 4));
this.cbStatuses.Items.Add(new Ext.Net.ListItem("Rejected", 7));
}
private void BindData()
{
Store store = this.GridPanel1.GetStore();
store.DataSource = this.GetDataNew();
store.DataBind();
}
private List<Data.Client> GetDataNew()
{
List<Data.Client> clntList = new List<Data.Client>();
clntList.Add(new Data.Client() { ID = 10, Name = "Client1", Number = "01", Note = "Client 1 Note", NumberNew = "01", NameNew = "Client1", TransferStatus_ID = 7 });
clntList.Add(new Data.Client() { ID = 11, Name = "Client2", Number = "02", Note = "Client 2 Note", NumberNew = "02", NameNew = "Client2", TransferStatus_ID = 7 });
return clntList;
}
[DirectMethod(Namespace = "ClientX")]
public void EditNew(int id, string field, string oldValue, string newValue, object customer)
{
string message = "<b>Property:</b> {0}<br /><b>Field:</b> {1}<br /><b>Old Value:</b> {2}<br /><b>New Value:</b> {3}";
// Send Message...
X.Msg.Notify(new NotificationConfig()
{
Title = "Edit Record #" + id.ToString(),
Html = string.Format(message, id, field, oldValue, newValue),
Width = 250,
Height = 150
}).Show();
this.GridPanel1.GetStore().GetById(id).Commit();
}
}
}
PageFunctions.js
var template = 'color:{0};';
var change = function (value, meta) {
meta.style = Ext.String.format(template, (value > 0) ? "green" : "red");
return value;
};
var pctChange = function (value, meta) {
meta.style = Ext.String.format(template, (value > 0) ? "green" : "red");
return value + "%";
};
var edit = function (editor, e) {
/*
"e" is an edit event with the following properties:
grid - The grid
record - The record that was edited
field - The field name that was edited
value - The value being set
originalValue - The original value for the field, before the edit.
row - The grid table row
column - The grid Column defining the column that was edited.
rowIdx - The row index that was edited
colIdx - The column index that was edited
*/
// Call DirectMethod
//alert(e.value);
if (!(e.value === e.originalValue || (Ext.isDate(e.value) && Ext.Date.isEqual(e.value, e.originalValue)))) {
ClientX.EditNew(e.record.data.ID, e.field, e.originalValue, e.value, e.record.data);
}
};
Thanks,
Dennis.