-
Hi fabricio.murta,
Yes, you were right, versions of Ext.Net on both projects were different. But even after keeping both the versions same. Things are not working for VB.NET project.
Same output is seen for vb.net project. I am not able to attach any listeners here.
Thanks,
Puneet
-
Hello! Can you share how you translated the controller and model to vb.net? I don't see the line on the view where you refer to the model on your VB.NET view.
EDIT: By the way, the example you posted previously for WebForms version has also its MVC C# version at Editable GridPanel With Save To [DirectMethod]
-
Controller.vb
Code:
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
Code:
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:
@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
-
1 Attachment(s)
Interesting @puns11! It seems Ext.NET is having hard times interpreting VB.NET lambda expressions, thus the listeners are not being output to the page at all!
At least when the lambda expressions are used as Function()
, that is.
Just change your Function(ls)
into Sub(ls)
that the events will get output just fine.
The nature of the Function
lambda expression does not really work with Ext.NET because of the page rendering mechanism. Declaring it as Sub
(subroutine) leaves the handles Ext.NET needs to output the code correctly.
I didn't really check the rest of the page but I believe that, solved this listeners emitting issue, you'll get extra room for learning the Ext.NET ways, right?..
Not sure you already are using that, but this may be a good hand for you while developing. You can either set on ResourceManager's .ScriptMode(ScriptMode.Debug).SourceFormatting(true)
or globally set it in Web.config
with the line:
Code:
<extnet theme="Gray" licenseKey="** Ext.NET LICENSE KEY HERE **" initScriptMode="Linked" sourceFormatting="True" scriptMode="Debug" />
Then once you open your pages (I usually run without Visual Studio's debugger when I want to check JavaScript sided issues), F12 developer tools will show you useful information like the script generated. When I tested with function lambda no listener block were output at all. With subroutine lambda, looks just nice!
Attachment 24608
I hope this helps!
-
Hi,
This really helped. using Sub instead of Function worked for me. But it is quite strange that Function is common approach.