Textbox with rightbuttons in grid componentcolumn

Hi,

I made a page with a simple grid some component columns and now i need an extra button on my first component column so i tought i'd use the textbox rightbuttons.

so now i have a textbox that's got a height of 50px

Code:

<ext:GridPanel runat="server" ID="GroupGrid" StoreID="GroupStore" Margin="10" ForceFit="true"> <TopBar> <ext:Toolbar ID="Toolbar1" runat="server"> <Items> <ext:Button ID="Button1" runat="server" Text="Save" Icon="TableSave"> <DirectEvents> <Click OnEvent="SaveGroups_DirectClick"> <ExtraParams> <ext:Parameter Name="GridValues" Mode="Raw" Value="#{GroupGrid}.getRowsValues({selectedOnly : false})" Encode="true"></ext:Parameter> </ExtraParams> </Click> </DirectEvents> </ext:Button> </Items> </ext:Toolbar> </TopBar> <ColumnModel runat="server"> <Columns> <ext:Column runat="server" Hidden="true" DataIndex="Id"></ext:Column> <ext:ComponentColumn runat="server" DataIndex="Description" Header="Description" Editor="true"> <Component> <ext:TextField runat="server"> <RightButtons> <ext:Button ID="Button2" runat="server" Icon="ApplicationEdit" ></ext:Button> </RightButtons> </ext:TextField> </Component> </ext:ComponentColumn> <ext:ComponentColumn runat="server" DataIndex="StartDate" Header="StartDate" Editor="true"> <Component> <ext:DateField runat="server"></ext:DateField> </Component> </ext:ComponentColumn> <ext:ComponentColumn runat="server" DataIndex="EndDate" Header="EndDate" Editor="true"> <Component> <ext:DateField runat="server"></ext:DateField> </Component> </ext:ComponentColumn> </Columns> </ColumnModel> </ext:GridPanel>

unless i use a fixed maxwidth of like 100px on this textbox i can't get it to show properly. is there any other way like using a container and putting a textbox and button inside? but how to do the datalinking to the textbox then?

anyway thanks in advance :)

Add the following css rule to the page

Code:

.no-padding .x-form-text { padding:0px !important; }

Add Cls="no-padding" to the textfield

thank you Vladimir,

that works for the button.

but now the textbox is missing a small part on the left i guess it's like 2 maybe 3px at the text start

also border-left and border-right are missing comes from (.x-grid .row-cmp-cell-ct td)

Thanks already :)

edit:

once i disable:

Code:

border-left: none !important; border-right: none !important; in .x-grid .row-cmp-cell-ct td

and

Code:

padding: 1px 5px 2px 5px;

in .x-grid-editor .x-form-text

then it's perfect but why is the class you gave me (padding 0px) acting different than just disabling the other padding i checked and the next padding attribute i find is padding:0; so i don't really know why the input text is moving :/

i just tried putting a directevent on the rightbutton items but it seems the controls don't exist for ext.net

Code:

<ext:GridPanel runat="server" ID="GroupGrid" StoreID="GroupStore" Margin="10" ForceFit="true"> <TopBar> <ext:Toolbar ID="Toolbar1" runat="server"> <Items> <ext:Button ID="Button1" runat="server" Text="Save" Icon="TableSave"> <DirectEvents> <Click OnEvent="SaveGroups_DirectClick"> <ExtraParams> <ext:Parameter Name="GridValues" Mode="Raw" Value="#{GroupGrid}.getRowsValues({selectedOnly : false})" Encode="true"></ext:Parameter> </ExtraParams> </Click> </DirectEvents> </ext:Button> </Items> </ext:Toolbar> </TopBar> <ColumnModel runat="server"> <Columns> <ext:Column runat="server" Hidden="true" DataIndex="Id"></ext:Column> <ext:ComponentColumn runat="server" DataIndex="Description" Header="Description" Editor="true"> <Component> <ext:TextField runat="server" Cls="no-padding"> <RightButtons> <ext:Button runat="server" Icon="ApplicationEdit" > <DirectEvents> <Click OnEvent="ShowTranslations_Event"> <ExtraParams> <ext:Parameter Name="row" Mode="Raw" Value="#{GroupGrid}.getRowsValues({selectedOnly : true})" Encode="true"></ext:Parameter> </ExtraParams> </Click> </DirectEvents> </ext:Button> </RightButtons> </ext:TextField> </Component> </ext:ComponentColumn> <ext:ComponentColumn runat="server" DataIndex="StartDate" Header="StartDate" Editor="true"> <Component> <ext:DateField runat="server"></ext:DateField> </Component> </ext:ComponentColumn> <ext:ComponentColumn runat="server" DataIndex="EndDate" Header="EndDate" Editor="true"> <Component> <ext:DateField runat="server"></ext:DateField> </Component> </ext:ComponentColumn> </Columns> </ColumnModel> <SelectionModel> <ext:RowSelectionModel></ext:RowSelectionModel> </SelectionModel> </ext:GridPanel>

when i click on one of the rightbuttons it gives me following exception

Quote:

The control with ID 'button-1026' not found

[HttpException (0x80004005): The control with ID 'button-1026' not found]
Ext.Net.ResourceManager.RaisePostBackEvent(String eventArgument) +1079
System.Web.UI.Page.RaisePostBackEvent(IPostBackEve ntHandler sourceControl, String eventArgument) +13
System.Web.UI.Page.RaisePostBackEvent(NameValueCol lection postData) +9528682
System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1724

edit:

also tried with a listener instead of a directevent but then i get record is undefined i only need to take the id with me but even when i don't send anything and check the selection model within the controller then it has no selectedrows at all.

and the ext.net version i'm using is 2.5.2.10697 i don't know if this might help.

guess it's just impossible with these controls then...

how about using plain html within a component column and binding data to it? is it possible and how to do it?

thx in advance :)

every idea to test is welcome. still can't seem to figure this out :/

i had to use imagecommands as workarround... is there any update yet on a fix? or will it be forever bugged? :/