PDA

View Full Version : How To: Add Context Menu to GridPanel



puns11
May 04, 2016, 7:35 PM
Hello Guys,

In Example explorer, I did not find any MVC example that demonstrate Context Menu in GridPanel.

Since I am using vb.net language, so far I have added this GridPanel.



@(Html.X().GridPanel() _
.Title("Editable GridPanel") _
.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().TextField()),
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")
) _
.Listeners(Function(ls) ls.RowContextMenu.Handler = "")
)

and here you can see I am trying to add RowContextMenu in listerners, but I am not able to move further. How to add items, and attach function to that item.
Like I want to add three labels in context menu, and each will have its onclick event which will open three different popups.

Can anyone help me proceed further?

fabricio.murta
May 04, 2016, 8:11 PM
Hello!

Here are some WebForms references that should just get you started with menus!

- context menus on a grid panel (http://examples4.ext.net/#/Action/Basic/Grid/)
- Context menus here are not actions like above, but simpler menu items where you can bind different events and better customize it (http://examples4.ext.net/#/Miscellaneous/Bin_HtmlBin/Overview/)
- Color context menu (http://examples4.ext.net/#/Toolbar/Menu/Context_Menu/)
- Menus loaded from server-side (http://examples4.ext.net/#/Toolbar/Menu/Dynamic_Items/)

As you pointed, there's no MVC examples for at least most of the above. But it shouldn't be difficult to get the idea, as the structural page would be pretty much the same!

I hope this helps!

fabricio.murta
May 04, 2016, 8:35 PM
A little starts-up would be like this:


@(
Html.X().Menu().ID("ContextMenu").Items( _
Html.X().MenuItem().Text("Item 1"),
Html.X().MenuItem().Text("Item 2"),
Html.X().MenuItem().Text("Item 3") _
)
)


That would be the context menu you want to show on right-click. You can bind actions to each one.

And the listener to trigger it would be:


.Listeners(Function(ls) ls.RowContextMenu.Handler = "e.stopEvent(); #{ContextMenu}.showAt(e.getXY()); return false;")


That's been based from the first example I provided you. Unfortunately, you didn't provide important information to run your example like the model and controller, so I can't really get to the bottom of it and test the suggestion above (in which it is possible it would fail for you until some adjustments are made).

We usually request full use cases so we can run the example in our side and then provide better and running suggestions. You may want to review our guidelines on posting questions. It is a reasonably long read but will provide you lots of information on how to help us help you!

They are here:
- Forum Guidelines For Posting New Topics (http://forums.ext.net/showthread.php?3440)
- More information required (http://forums.ext.net/showthread.php?10205)

I hope this helps!

puns11
May 05, 2016, 9:24 AM
Thanks. Sorry I was not clear earlier. I have used same controller and model as mentioned in this example (http://mvc.ext.net/#/GridPanel_Editable/Editor_with_DirectMethod/).

Also what you suggested to add a ContextMenu and then bind to listeners. But it is not working.

@(Html.X().Menu().ID("ContextMenus").Items(
Html.X().MenuItem().Text("Item 1"),
Html.X().MenuItem().Text("Item 2"),
Html.X().MenuItem().Text("Item 3")
)
)



@(Html.X().GridPanel() _
.Title("Commision Checks") _
.Width(600) _
.Height(350) _
.Store(Html.X().Store() _
.ID("Store1") _
.Buffered(True) _
.Model(Html.X().Model() _
.IDProperty("ID") _
.Fields(
New ModelField("comm_check_number", ModelFieldType.String),
New ModelField("comm_check_date_written", ModelFieldType.Date),
New ModelField("comm_check_date_sent", ModelFieldType.Date),
New ModelField("comm_check_amount", ModelFieldType.Float),
New ModelField("comm_check_type_desc", ModelFieldType.String)
)
) _
.DataSource(Model.CommissionChecksList)
) _
.ColumnModel(
Html.X().Column().Text("Check Number").DataIndex("comm_check_number").Width(35) _
.Flex(1) _
.Editor(Html.X().ComboBox()),
Html.X().DateColumn() _
.Text("Date Written") _
.DataIndex("comm_check_date_written") _
.Flex(1) _
.Format("MM-dd-yyyy") _
.Editor(Html.X().DateField().Format("MM-dd-yyyy")),
Html.X().DateColumn() _
.Text("Date Sent") _
.DataIndex("comm_check_date_sent") _
.Format("MM-dd-yyyy") _
.Editor(Html.X().DateField().Format("MM-dd-yyyy")),
Html.X().Column() _
.Text("Change") _
.DataIndex("comm_check_amount") _
.Renderer(RendererFormat.UsMoney) _
.Editor(Html.X().NumberField()),
Html.X().Column() _
.Text("Check Type") _
.DataIndex("comm_check_type_desc") _
.Editor(Html.X().TextField())
) _
.SelectionModel(Html.X().CellSelectionModel()) _
.Plugins(
Html.X().CellEditing().Listeners(Function(ls) ls.Edit.Fn = "edit")
) _
.Listeners(Function(ls) ls.RowContextMenu.Handler = "e.stopEvent(); #{ContextMenus}.showAt(e.getXY()); return false;")
)

puns11
May 05, 2016, 7:07 PM
Hi,

I tried another thing to show the context menu but this is not what we are looking for.

I removed the listener and instead added


.ContextMenuID("ContextMenu")

Now what it does is, whenever I right click anywhere on the grid, either on row, or empty area of grid or title of the grid, the Context Menu Appears.
But I need to show only on Row Right Click.

What I am thinking is that the line of code which you provided will not work with vb syntax. I think in below line reference to ContextMenu using #{ContextMenu} might be a problem.


.Listeners(Function(ls) ls.RowContextMenu.Handler = "e.stopEvent(); #{ContextMenu}.showAt(e.getXY()); return false;")

Can you please help me create this example for vb?

Thanks.

puns11
May 05, 2016, 8:59 PM
alright. I figured it out.

RowContextMenu is not directly binded to GridPanel. I suppose, first ViewConfig of GridView type is required and then binding listener to GridView instead of GridPanel will work for RowContextMenu event to fire.


.View(Function(view) view.Add(Html.X().GridView().Listeners(Function(ls ) ls.RowContextMenu.Handler= "e.stopEvent(); #{ContextMenu}.showAt(e.getXY()); return false;")))

I was studying the web form example, and listeners were added in <ViewConfig> tag. From there I got some hint, and then I searched if anyone has ever tried adding ViewConfig in MVC, and then I found this example (http://forums.ext.net/showthread.php?16920-CLOSED-2-0-MVC-3-Razor-Example)is forum where View() was adding GridView to GridPanel.

Though there was strange thing happening after that. I was getting js error, that
Cannot read property 'showAt' of null

To fix this error, I had to move the @(Html.X().ResourceManager()) from layout view to actual index view where I was calling showAt. This seems to be strange and Ext.Net team want to look into that.

Thanks.

fabricio.murta
May 05, 2016, 10:02 PM
Hello @puns11! Glad to see you are having progress on Ext.NET!

When you load your page with ResourceManager on Layout, what do you get in "e.stopEvent(); #{ContextMenu}.showAt(e.getXY()); for #{ContextMenu}?

Usually on WebForms it may be enough to just replace #{ContextMenu} with App.ContextMenu but this might not work in MVC in some situations (for example, with partial view).

For some reason, as the resources were defined somewhere else, #{ContextMenu} might have not been replaced properly and I believe your page were getting "e.stopEvent(); .showAt(e.getXY()); instead of something like "e.stopEvent(); App.ContextMenu.showAt(e.getXY()); .

puns11
May 06, 2016, 9:00 PM
Hi,

That maybe the case in MVC.
But as yesterday I told you how I was able to attach RowContextMenu to GridPanel by adding View(). In actually I tried in C# first, but when I moved the same code in VB.NET project. The same piece of code was not working. In Fact I was not able to attach any listeners to GridPanel. Furthermore, Listeners was not working with any of the control in vb.net. It was very strange issue.

Below are two projects that I am currently playing with using Ext.Net to create a demo for client to approve this framework.

Note: Model and Controller are same in both projects and are referred from this example (http://examples.ext.net/#/GridPanel/Editable/Editor_with_DirectMethod/)
View in C# project

@model System.Collections.IEnumerable

@{
ViewBag.Title = "Editor with DirectMethod - Ext.NET MVC Examples";
}

<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())
<h1>Editable GridPanel With Save To [DirectMethod]</h1>

@(
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()
.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().TextField()),
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("yyyy-MM-dd")
.Editor(Html.X().DateField().Format("yyyy-MM-dd"))
)
.SelectionModel(Html.X().CellSelectionModel())
.Plugins(
Html.X().CellEditing().Listeners(ls => ls.Edit.Fn = "edit")
).View(Html.X().GridView().Listeners(ls=> ls.RowContextMenu.Handler= "e.stopEvent(); #{ContextMenu}.showAt(e.getXY()); return false;"))
)



View in VB.NET project




@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>



Can you please run this above vb.net example at your end and let me know what wrong I am doing here in vb.net?

Thanks,
Puneet

puns11
May 06, 2016, 9:14 PM
And in further investigation, I found that the Ext.axd file generated by compiler for each project is bit different. Below is the code of ext.axd generated from both projects(comparison).

24600

You can see that listeners part is missing in the vb.net project. Looks like compiler did not generate that part for vb.net. Can you please check with your team?

fabricio.murta
May 06, 2016, 11:05 PM
Hello @puns11!

That difference you show in the screenshot can be naught but different Ext.NET DLL files you use in the projects. Please, if you double checked them, triple-check! The difference you show is too clear to me that is provenient from a version upgrade.

The screenshots suggests you compared between the ext-all-debug.js. Notice just saying ext.axd is very vague, as this is just the entrypoint for the diversity of embedded resources in Ext.NET. The path to ext.axd is more informative.

puns11
May 07, 2016, 12:10 AM
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

fabricio.murta
May 07, 2016, 1:41 AM
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] (http://mvc4.ext.net/#/GridPanel_Editable/Editor_with_DirectMethod/)

puns11
May 11, 2016, 12:22 PM
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

fabricio.murta
May 12, 2016, 3:17 AM
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(tru e) or globally set it in Web.config with the line:



<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!

24608

I hope this helps!

puns11
May 12, 2016, 12:47 PM
Hi,

This really helped. using Sub instead of Function worked for me. But it is quite strange that Function is common approach.