Controller.vb
Imports Ext.Net
Imports Ext.Net.MVC
Public Class HomeController
Inherits System.Web.Mvc.Controller
Function Index() As ActionResult
Return View(DirectMethodModel.Company.GetAll())
End Function
Public Function Edit(id As Integer, field As String, oldValue As String, newValue As String, customer As Object) As DirectResult
Dim message As String = "<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() With {
.Title = "Edit Record #" + id.ToString(),
.Html = String.Format(message, id, field, oldValue, newValue),
.Width = 250,
.Height = 150
}).Show()
X.GetCmp(Of Store)("Store1").GetById(id).Commit()
Return Me.Direct()
End Function
Function About() As ActionResult
ViewData("Message") = "Your application description page."
Return View()
End Function
Function Contact() As ActionResult
ViewData("Message") = "Your contact page."
Return View()
End Function
End Class
Model.vb
Imports System.Collections
Imports System.Collections.Generic
Namespace DirectMethodModel
Public Class Company
Public Property ID() As Integer
Get
Return m_ID
End Get
Set
m_ID = Value
End Set
End Property
Private m_ID As Integer
Public Property Name() As String
Get
Return m_Name
End Get
Set
m_Name = Value
End Set
End Property
Private m_Name As String
Public Property Price() As Double
Get
Return m_Price
End Get
Set
m_Price = Value
End Set
End Property
Private m_Price As Double
Public Property Change() As Double
Get
Return m_Change
End Get
Set
m_Change = Value
End Set
End Property
Private m_Change As Double
Public Property PctChange() As Double
Get
Return m_PctChange
End Get
Set
m_PctChange = Value
End Set
End Property
Private m_PctChange As Double
Public Property LastChange() As DateTime
Get
Return m_LastChange
End Get
Set
m_LastChange = Value
End Set
End Property
Private m_LastChange As DateTime
Public Shared Function GetAll() As IEnumerable
Dim today As DateTime = DateTime.Today
Return New List(Of Company)() From {
New Company() With {
.ID = 1,
.Name = "3m Co",
.Price = 71.72,
.Change = 0.02,
.PctChange = 0.03,
.LastChange = today
},
New Company() With {
.ID = 2,
.Name = "Alcoa Inc",
.Price = 29.01,
.Change = 0.42,
.PctChange = 1.47,
.LastChange = today
},
New Company() With {
.ID = 3,
.Name = "Altria Group Inc",
.Price = 83.81,
.Change = 0.28,
.PctChange = 0.34,
.LastChange = today
},
New Company() With {
.ID = 4,
.Name = "American Express Company",
.Price = 52.55,
.Change = 0.01,
.PctChange = 0.02,
.LastChange = today
},
New Company() With {
.ID = 5,
.Name = "American International Group, Inc.",
.Price = 64.13,
.Change = 0.31,
.PctChange = 0.49,
.LastChange = today
},
New Company() With {
.ID = 6,
.Name = "AT&T Inc.",
.Price = 31.61,
.Change = -0.48,
.PctChange = -1.54,
.LastChange = today
}
}
End Function
End Class
End Namespace
View
@Code
ViewData("Title") = "Home Page"
End Code
<script>
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
if (!(e.value === e.originalValue || (Ext.isDate(e.value) && Ext.Date.isEqual(e.value, e.originalValue)))) {
Ext.net.DirectMethod.request({
url: '@(Url.Action("Edit"))',
params: {
id: e.record.data.ID,
field: e.field,
oldValue: e.originalValue,
newValue: e.value,
customer: e.record.data
}
});
}
};
</script>
@(Html.X().ResourceManager())
<div class="jumbotron">
</div>
<div class="row">
<div class="col-md-4">
@(
Html.X().Menu().ID("ContextMenu").Items(
Html.X().MenuItem().Text("Item 1"),
Html.X().MenuItem().Text("Item 2"),
Html.X().MenuItem().Text("Item 3")
).Floating(True)
)
@(Html.X().GridPanel() _
.Title("Edit") _
.Width(600) _
.Height(350) _
.Store(Html.X().Store() _
.ID("Store1") _
.Model(Html.X().Model() _
.IDProperty("ID") _
.Fields(
New ModelField("ID", ModelFieldType.Int),
New ModelField("Name"),
New ModelField("Price", ModelFieldType.Float),
New ModelField("Change", ModelFieldType.Float),
New ModelField("PctChange", ModelFieldType.Float),
New ModelField("LastChange", ModelFieldType.Date)
)
) _
.DataSource(Model)
) _
.ColumnModel(
Html.X().Column().Text("ID").DataIndex("ID").Width(35),
Html.X().Column() _
.Text("Name") _
.DataIndex("Name") _
.Flex(1) _
.Editor(Html.X().ComboBox().Listeners(Function(m) m.Change.Handler = "alert('hi')")),
Html.X().Column() _
.Text("Price") _
.DataIndex("Price") _
.Renderer(RendererFormat.UsMoney) _
.Editor(Html.X().NumberField()),
Html.X().Column() _
.Text("Change") _
.DataIndex("Change") _
.Renderer("change") _
.Editor(Html.X().NumberField()),
Html.X().Column() _
.Text("PctChange") _
.DataIndex("PctChange") _
.Renderer("pctChange") _
.Editor(Html.X().NumberField()),
Html.X().DateColumn() _
.Text("Last Updated") _
.DataIndex("LastChange") _
.Format("MM-dd-yyyy") _
.Editor(Html.X().DateField().Format("MM-dd-yyyy"))
) _
.SelectionModel(Html.X().CellSelectionModel()) _
.Plugins(
Html.X().CellEditing().Listeners(Function(ls) ls.Edit.Fn = "edit")
).View(Html.X().GridView().Listeners(Function(ls) ls.RowContextMenu.Handler = "e.stopEvent(); #{ContextMenu}.showAt(e.getXY()); return false;"))
)
</div>
</div>
You can see I am even trying to run the alert on combobox which is also not working for me in vb project.
Please let me know if you see any issue in above code.
Thanks,
Puneet