Oct 21, 2014, 9:00 PM
[CLOSED] Menu Row Command - Item Hide or Disabled
Hi Ext.net support team !!
I'm using the GridPanel control for deploy information, for each row I have added a Menu Row Command.
My problem is, How I can implement the next example:
I want to deploy only the Example 1 option, for the prices between 30 y 50.
I want to deploy the Example 2 option, for the prices between 51 y 70
I don't want to deploy/enable neither option, for the prices lower than 30.
I want to deploy all the options, for the prices higher than 70.
Continuing, to select an option open a windows Example 1 -> window 1 y Example 2 -> window 2,
my problem is, how deliver the value of the row to the controls that exist inside the windows.
I'm using the GridPanel control for deploy information, for each row I have added a Menu Row Command.
My problem is, How I can implement the next example:
I want to deploy only the Example 1 option, for the prices between 30 y 50.
I want to deploy the Example 2 option, for the prices between 51 y 70
I don't want to deploy/enable neither option, for the prices lower than 30.
I want to deploy all the options, for the prices higher than 70.
Continuing, to select an option open a windows Example 1 -> window 1 y Example 2 -> window 2,
my problem is, how deliver the value of the row to the controls that exist inside the windows.
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" }
};
this.Store1.DataBind();
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Menu Row Command - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<script>
var prepare = function (grid, toolbar, rowIndex, record)
{
var theButton = toolbar.items.get(0);
var menuItem1 = theButton.menu.child("[command=Ex1]");
var menuItem2 = theButton.menu.child("[command=Ex2]");
if ((record.data.price >= 30) && (record.data.price <= 50))
{
menuItem2.setDisabled(true);
menuItem2.setTooltip("Disabled");
}
else if ((record.data.price > 50) && (record.data.price <= 70))
{
menuItem1.setDisabled(true);
menuItem1.setTooltip("Disabled");
}
else if (record.data.price < 30)
{
menuItem1.setDisabled(true);
menuItem1.setTooltip("Disabled");
menuItem2.setDisabled(true);
menuItem2.setTooltip("Disabled");
}
};
</script>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>Menu Row Command</h1>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Menu Row Command"
Width="600"
Height="300">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="company" />
<ext:ModelField Name="price" Type="Float" />
<ext:ModelField Name="change" Type="Float" />
<ext:ModelField Name="pctChange" Type="Float" />
<ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server"
Text="Company"
Width="160"
DataIndex="company"
Flex="1" />
<ext:Column ID="Column2" runat="server"
Text="Price"
Width="75"
DataIndex="price">
<Renderer Format="UsMoney" />
</ext:Column>
<ext:Column ID="Column3" runat="server"
Text="Change"
Width="75"
DataIndex="change" />
<ext:Column ID="Column4" runat="server"
Text="Change"
Width="75"
DataIndex="pctChange" />
<ext:DateColumn ID="DateColumn1" runat="server"
Text="Last Updated"
Width="85"
DataIndex="lastChange" />
<ext:CommandColumn ID="CommandColumn1" runat="server" Width="80">
<Commands>
<ext:GridCommand Icon="ArrowDown">
<Menu EnableScrolling="false">
<Items>
<ext:MenuCommand Text="Example 1" Icon="Application" CommandName="Ex1" />
<ext:MenuCommand Text="Example 2" Icon="Application" CommandName="Ex2" />
</Items>
</Menu>
<ToolTip Text="Menu" />
</ext:GridCommand>
</Commands>
<PrepareToolbar Fn="prepare" />
<Listeners>
<Command Handler="
if (command == 'Ex1')
{
#{TextFieldCompany1}.setValue(record.data.company);
#{TextFieldPrice1}.setValue(record.data.price);
#{Window1}.show();
}
else if (command == 'Ex2')
{
#{TextFieldCompany2}.setValue(record.data.company);
#{TextFieldChange2}.setValue(record.data.change);
#{TextFieldLastUpdated2}.setValue(record.data.lastChange);
#{Window2}.show();
}" />
</Listeners>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Single" />
</SelectionModel>
</ext:GridPanel>
<ext:Window ID="Window1" runat="server"
Title="Example 1"
Icon="Table"
Modal="true"
Width="400"
Height="100"
Collapsible="true"
Hidden="true"
Layout="Fit" Closable="false">
<Items>
<ext:FormPanel ID="FormPanelAgregar" runat="server"
DefaultAnchor="100%"
BodyPadding="5">
<Items>
<ext:TextField ID="TextFieldCompany1" runat="server" FieldLabel="Company" ReadOnly="true" Name="Company" />
<ext:TextField ID="TextFieldPrice1" runat="server" FieldLabel="Price" ReadOnly="true" Name="Price" />
</Items>
</ext:FormPanel>
</Items>
<Tools>
<ext:Tool ToolTip="Cerrar" CustomType="my-close" Handler="owner.ownerCt.close();" Width="19" Height="19" />
</Tools>
</ext:Window>
<ext:Window ID="Window2" runat="server"
Title="Example 2"
Icon="Table"
Modal="true"
Width="400"
Height="150"
Collapsible="true"
Hidden="true"
Layout="Fit" Closable="false">
<Items>
<ext:FormPanel ID="FormPanel1" runat="server"
DefaultAnchor="100%"
BodyPadding="5">
<Items>
<ext:TextField ID="TextFieldCompany2" runat="server" FieldLabel="Company" ReadOnly="true" Name="Company" />
<ext:TextField ID="TextFieldChange2" runat="server" FieldLabel="Change" ReadOnly="true" Name="Change" />
<ext:TextField ID="TextFieldLastUpdated2" runat="server" FieldLabel="Last Updated" ReadOnly="true" Name="LastUpdated" />
</Items>
</ext:FormPanel>
</Items>
<Tools>
<ext:Tool ToolTip="Cerrar" CustomType="my-close" Handler="owner.ownerCt.close();" Width="19" Height="19" />
</Tools>
</ext:Window>
</form>
</body>
</html>
From already thank you very much for any comments and/or observation.
Last edited by Daniil; Oct 25, 2014 at 6:59 AM.
Reason: [CLOSED]