This is a migrated thread and some comments may be shown as answers.

GridBoundColumn ItemStyle Wrap for selected rows

2 Answers 68 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Andy
Top achievements
Rank 1
Andy asked on 13 Jun 2013, 04:40 PM
I have a column that has some long data values.  On unselected rows I would like the ItemStyle wrap="False".  And when I select a row I want the style for this column in the selected row to have wrap="True".  Is there a way to do this, either through configuration in the aspx or in client code?  I do have a client javascript function for the onRowSelected event where I could put some code.

2 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 1
answered on 14 Jun 2013, 06:18 AM
Hi Andy,

I guess you want to wrap a column when that row is selected,the only wrap propery available is normal and break-word;you cant increase the column width using that,but you can show the long words in broken parts. Here is an example i have tried.Please try using this,by setting the CSS property of the selected row.Hope this helps you.

ASPX:
<telerik:RadGrid ID="RadGrid2" runat="server" AllowPaging="True" >
 <MasterTableView TableLayout="Fixed"  AutoGenerateColumns="False" >
  <Columns>
        <telerik:GridBoundColumn DataField="OrderID" HeaderText="OrderID" UniqueName="OrderID">
        </telerik:GridBoundColumn>
        <telerik:GridBoundColumn DataField="ShipName" HeaderText="ShipName" UniqueName="ShipName">
        </telerik:GridBoundColumn>
  </Columns>
 <ClientSettings
    <Selecting AllowRowSelect="true" />
 </ClientSettings>
</telerik:RadGrid>

CSS:
<style type="text/css">
  .RadGrid_Default .rgSelectedRow td
   {
     border-bottom-color: #6C6C6C;
     word-wrap: break-word;
   }
</style>

Thanks,
Princy
0
Andy
Top achievements
Rank 1
answered on 14 Jun 2013, 01:28 PM

I found a solution that works for my situation.  The basic idea is to create a client event for the OnRowSelected and OnRowDeselected events and modify the style property of the column I need changed.  Here is some sample code.

Here is a snipet from my aspx file of the settings on my column which is the 9th column in my radgrid.

<telerik:GridBoundColumn DataField="NOTES" SortExpression="NOTES" HeaderText="Notes">
         <HeaderStyle HorizontalAlign="left" />
          <ItemStyle HorizontalAlign="left"  Wrap="False"/>
</telerik:GridBoundColumn>

Here is the javascript for the client events.

function rg_OnRowDeselected(sender, eventArgs) {
   eventArgs.get_item()._element.children[8].style.whiteSpace = "nowrap";
}

function rg_OnRowSelected(sender, eventArgs) {

   eventArgs.get_item()._element.children[8].style.whiteSpace = "normal";
}

Tags
Grid
Asked by
Andy
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 1
Andy
Top achievements
Rank 1
Share this question
or