PDA

View Full Version : [CLOSED] Show Button ONLY in certain case... but in GridPanel



Mario
Jan 21, 2015, 9:03 AM
I need to show a Column in a Gridpanel that shows a TextField in cells that shows a Button only in certain case... only if I press the "1" button.

In single Form the code run correctly... look here:
http://forums.ext.net/showthread.php?51731-CLOSED-Show-Button-ONLY-in-certains-case

But... if I make the code for GridPanel Column, it not works.

Also the layout and the auto width (flex = 1) not works.

Can you help me?

The code:



<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html>

<html>
<head runat="server">
<title></title>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = new object[]
{
new object[] { 1, "1" },
new object[] { 2, "2" },
new object[] { 3, "3" }
};

this.Store1.DataBind();
}
}
</script>

<script type="text/javascript">
var keyFn = function (el, e) {
if (e.button == '48') {
App.ButtonTest.show();
}
else {
App.ButtonTest.hide();
}
return false;
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" ID="ResourceManager1" />

<ext:GridPanel runat="server" ID="GridPanel1" Width="300">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model runat="server" ID="Model1">
<Fields>
<ext:ModelField Name="ID" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server" ID="ColumnModel1">
<Columns>
<ext:Column runat="server" Text="Groups" >
<Columns>
<ext:Column runat="server" DataIndex="ID" Width="50" Text="ID" />
<ext:ComponentColumn runat="server" DataIndex="Name" Flex="1" Text="Name">
<Component>
<ext:TextField runat="server" EnableKeyEvents="true" >
<Listeners>
<KeyPress Fn="keyFn" />
</Listeners>
<RightButtons>
<ext:Button ID="ButtonTest" runat="server" Icon="Add" Hidden="true" />
</RightButtons>
</ext:TextField>
</Component>
</ext:ComponentColumn>
</Columns>
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>

Sergei
Jan 21, 2015, 1:13 PM
Hi!

Try this solution. It is not perfect, but it works.



<%@ 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[] { 1, "" },
new object[] { 2, "" },
new object[] { 3, "" }
};
this.Store1.DataBind();
}
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<style type="text/css">
.x-grid .row-cmp-cell-ct td {
position: relative;
border-left: 1px solid #b5b8c8 !important;
border-right: 1px solid #b5b8c8 !important;
vertical-align: middle !important;
}

.x-field-buttons-body .x-btn-icon {
position: absolute;
top: 2px;
right: 0;
}
</style>

<script type="text/javascript">
var keyFn = function (el, e) {
if (e.button == '48') {
this.rightButtons[0].show();
}
else {
this.rightButtons[0].hide();
}
return false;
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server" Width="300">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="ID" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" DataIndex="ID" Width="30" Text="ID" />
<ext:ComponentColumn runat="server" DataIndex="Name" Flex="1" Editor="true" Text="Name">
<Component>
<ext:TextField runat="server" EnableKeyEvents="true">
<Listeners>
<KeyPress Fn="keyFn" />
</Listeners>
<RightButtons>
<ext:Button runat="server" Icon="Add" Hidden="true" />
</RightButtons>
</ext:TextField>
</Component>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>

Mario
Jan 21, 2015, 2:43 PM
Tnx SERGEI... it works.

But... I need to use a "Group Columns".
If I use this ColumnModel definition the Master Column wrong... :(

Solutions?



<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="GROUP" >
<Columns>
<ext:Column runat="server" DataIndex="ID" Width="30" Text="ID" />
<ext:ComponentColumn runat="server" DataIndex="Name" Flex="1" Editor="true" Text="Name">
<Component>
<ext:TextField runat="server" EnableKeyEvents="true">
<Listeners>
<KeyPress Fn="keyFn" />
</Listeners>
<RightButtons>
<ext:Button runat="server" Icon="Add" Hidden="true" />
</RightButtons>
</ext:TextField>
</Component>
</ext:ComponentColumn>
</Columns>
</ext:Column>
</Columns>
</ColumnModel>

Daniil
Jan 22, 2015, 1:43 PM
the Master Column wrong... :(

Not sure what you mean. Please clarify.

Mario
Jan 23, 2015, 1:35 PM
Problem solved.
You can close the thread.