Jan 17, 2017, 1:06 PM
[CLOSED] Dynamically Build Context Menu
hi,
I am trying to dynamically build context menus. I want to enable a Menu object and then attach 3 menuitems to it. i expected to see a nice Arrow for the Menu and a subwindow with the three items but that isnt what happens. I dont see a nice arrow and the subwindow overlaps the original context menu. pls assist.
see full standalone example below
Thanks,
/Z
I am trying to dynamically build context menus. I want to enable a Menu object and then attach 3 menuitems to it. i expected to see a nice Arrow for the Menu and a subwindow with the three items but that isnt what happens. I dont see a nice arrow and the subwindow overlaps the original context menu. pls assist.
see full standalone example below
Thanks,
/Z
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.Generic" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Menu bug</title>
<script type="text/javascript">
var setupDualEmps = function (menuItem) {
App.testmenuitem.setVisible(true);
App.testmenuitemthing.setVisible(false);
//clear it
App.testmenuitem.removeAll();
var obj = this;
var menuItem = Ext.create("Ext.menu.Item", {
text: 'Row test1'
});
App.testmenuitem.add(menuItem);
var menuItem = Ext.create("Ext.menu.Item", {
text: 'Row test2'
});
App.testmenuitem.add(menuItem);
var menuItem = Ext.create("Ext.menu.Item", {
text: 'Row test2'
});
App.testmenuitem.add(menuItem);
};
</script>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server">
</ext:ResourceManager>
<ext:Viewport ID="Viewport1" runat="server" Layout="FitLayout">
<Items>
<ext:GridPanel
ID="GridPanel1"
runat="server"
ContextMenuID="testmenu"
Title="Test"
EmptyText="test"
ColumnLines="true"
Layout="FitLayout">
<Store>
<ext:Store ID="Store1" runat="server" AutoLoad="false">
<Proxy>
<ext:AjaxProxy Url="/ta/Support/test">
<ActionMethods READ="GET" />
<Reader>
<ext:JsonReader IDProperty="id" RootProperty="data" TotalProperty="total"/>
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="TaskID">
<Fields>
<ext:ModelField Name="ProjectID" Type="Int" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="TaskID" Type="Int" />
<ext:ModelField Name="Description" />
<ext:ModelField Name="Estimate" Type="Int" />
<ext:ModelField Name="Rate" Type="Float" />
<ext:ModelField Name="Cost" Type="Float" />
<ext:ModelField Name="Due" Type="Date" />
</Fields>
</ext:Model>
</Model>
<Listeners>
<Load Handler="Ext.net.Mask.show();" Delay="5000" />
</Listeners>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1"
runat="server"
TdCls="task"
Text="Task"
Sortable="true"
DataIndex="Description"
Hideable="false"
Width="300">
</ext:Column>
<ext:Column ID="Column2" runat="server" Text="Project" DataIndex="Name" Width="180" />
<ext:DateColumn ID="DateColumn1"
runat="server"
Width="130"
Text="Due Date"
Sortable="true"
DataIndex="Due"
Format="MM/dd/yyyy">
</ext:DateColumn>
<ext:Column ID="Column3"
runat="server"
Width="130"
Text="Estimate"
Sortable="true"
DataIndex="Estimate">
</ext:Column>
<ext:Column ID="Column4"
runat="server"
Width="130"
Text="Rate"
Sortable="true"
DataIndex="Rate">
</ext:Column>
<ext:Column
runat="server"
Width="130"
ID="Cost"
Text="Cost"
Sortable="false"
Groupable="false"
DataIndex="Cost">
</ext:Column>
</Columns>
</ColumnModel>
<View>
<ext:GridView ID="GridView7" runat="server" StripeRows="true" EmptyText="No Data"/>
</View>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Single" />
</SelectionModel>
</ext:GridPanel>
</Items>
</ext:Viewport>
<ext:Menu ID="testmenu" runat="server">
<Listeners>
<Show Handler="setupDualEmps();Ext.QuickTips.getQuickTip().hide();" />
</Listeners>
<Items>
<ext:Label ID="Label1" runat="server" Html="<b class='menu-title'>Choose an Option</b>" />
<ext:Menu ID="testmenuitem" runat="server" Icon="ArrowRight" Text="View eInfo" Group="theme" Hidden="true"/>
<ext:MenuItem ID="testmenuitemthing" runat="server" Icon="CalendarEdit" Text="View Info" Group="theme">
</ext:MenuItem>
<ext:MenuSeparator ID="MenuSeparator1" runat="server" />
<ext:MenuItem ID="MenuItem1" runat="server" Icon="Calendar" Text="View Test" Group="theme">
</ext:MenuItem>
<ext:MenuItem ID="MenuItem2" runat="server" Icon="UserB" Text="View Test2" Group="theme">
</ext:MenuItem>
</Items>
</ext:Menu>
</form>
</body>
</html>
Last edited by fabricio.murta; Jan 18, 2017 at 4:05 PM.