RadGrid Edit Form InPlace Textbox Width

[Jonathan]

Hi,

I've been searching the forum for an answer to this question for days and it appears that no one has covered it before. I'm using InPlaceEdit mode for my RadGrid control. When I put it into edit mode, the size of the text fields that show up stretch the page I'm using quite a bit.

Question: Is there a way to customize the width of the textboxes that appear in the RadGrid edit mode's inplace edit mode?

[Jonathan]

It appears that my question has an alternative answer as shown by this helpful video. Thanks anyway.

[Elmar De Groot]

Not sure whether this is one of the solutions discussed in the video as I didn't take the time to watch the video as it took to long...
Anyway the easiest solution (to the best of my knowledge) is to add a css class with the following definition:

.maximize input[type=text] { width:100%; }

and then reference this css class in your bound column like so:

<telerik:gridboundcolumn datafield="Name" headertext="Name" headerstyle-width="200px" itemstyle-cssclass="maximize" />

This way the text editor will follow the size that you have set in your gridcolumn.
Ciao,

Elmar

[Iman]

hi
i have same problem, but my  column is GridNumericColum and input box is RadNumericTextBox

your CssClass is work properly for input[type=text] and dont work for RadNumericTextBox!
are you have any suggestion?

[Shinu]

Hello Iman,

One suggestion is you can access the column in edit mode and set the width as shown below.
C#:

void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
{
 if (e.Item is GridEditableItem && e.Item.IsInEditMode)
 {
   GridEditableItem item = (GridEditableItem)e.Item;
   RadNumericTextBox txt = (RadNumericTextBox)item["Numeric"].Controls[0];
   txt.Width = Unit.Pixel(160);
 }
}

Thanks,
Shinu.

[Iman]

hi Shinu
Tank you for your replay.
I founded it after research but i have to many Numeric column in my grid.
however, now i have another question,
did has any way to setRadNumericTextBox inGridEditableItem without programmatically?

regards.

[Ramon]

some JQuery:

$telerik.$(document).ready(function () {
      $telerik.$(".rgEditRow :input[id*=Text]").width("400px");
    });

in this case id*=Text means that the control contains, somewhere in the name, the  UniqueName you assigned to the column.
 UniqueName="Text"
which is inside the .rgEditRow at edit time

[Sabaratnam]

Thanks a lot Elmar for your post. 

It saved me a lot of trouble.

[quote]Elmar De Groot said:Not sure whether this is one of the solutions discussed in the video as I didn't take the time to watch the video as it took to long...
Anyway the easiest solution (to the best of my knowledge) is to add a css class with the following definition:

.maximize input[type=text] { width:100%; }

and then reference this css class in your bound column like so:

<telerik:gridboundcolumn datafield="Name" headertext="Name" headerstyle-width="200px" itemstyle-cssclass="maximize" />

This way the text editor will follow the size that you have set in your gridcolumn.
Ciao,

Elmar[/quote]