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

making the GridLine bold

6 Answers 134 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Anjali
Top achievements
Rank 1
Anjali asked on 12 May 2011, 09:03 PM

Hi All,

I have a gridview. I have one linkbutton in the gridView and others are gridTemplatecolumns. I want to make the whole row bold whenever the user clicks on the link button

2344       abc   def        ghi    nes

so for e.g.

whenever user clicks on 2344, I want to make  2344 abc  gth rwe nes bold or of different color. Is it possible to do that.
so far my code is like below

<telerik:RadGrid ID="RadGrid_Picker" AllowSorting="True" PageSize="100" AllowPaging="True"
                                        AllowMultiRowSelection="True" runat="server" GridLines="None" OnPageIndexChanged="RadGrid_Picker_PageIndexChanged"
                                        OnPageSizeChanged="RadGrid_Picker_PageSizeChanged" Width="1500px" Visible="false" OnItemCommand="RadGrid_Picker_ItemCommand" OnItemDataBound="RadGrid_Picker_ItemDataBound"   >
                                        <ClientSettings EnableRowHoverStyle="true"><Selecting AllowRowSelect="true" /></ClientSettings>
                                        <MasterTableView Width="100%" Summary="RadGrid table" DataKeyNames="ID" />
                                        <MasterTableView RetrieveAllDataFields="true" AutoGenerateColumns="false" >
                                            <Columns>
                                               <telerik:GridBoundColumn DataField="ID"  Visible="false"></telerik:GridBoundColumn>
                                                <telerik:GridTemplateColumn UniqueName="TemplateLinkColumn"  AllowFiltering="false" HeaderText="ID">
                                                    <ItemTemplate>
                                                        <asp:LinkButton ID="ID_Link" runat="server" OnClick="ID_Link_Click" Text='<%#Bind("ID") %>' CommandName="Bold"></asp:LinkButton>
                                                      
                                                    </ItemTemplate>
                                                </telerik:GridTemplateColumn>
</Columns>
                                        </MasterTableView>
                                        <PagerStyle Mode="NextPrevAndNumeric" />
                                    </telerik:RadGrid>
  
  
and in the code behind
  
    protected void RadGrid_Picker_ItemCommand(object sender, GridCommandEventArgs e)
    {
        if (e.CommandName == "Bold")
        {
            GridDataItem item = (GridDataItem)e.Item;
            string value = item.GetDataKeyValue("ID").ToString();
            e.Item.Style.Add(HtmlTextWriterStyle.FontWeight, "Bold");
        }
    }



Thanks.

6 Answers, 1 is accepted

Sort by
0
Gimmik
Top achievements
Rank 1
answered on 12 May 2011, 10:04 PM
Hi Anjali,

I think the simplest way to highlight a row in a RadGrid is to make the row selected. The code is simple, just all the below code snippet to your RadGrid.

<ClientSettings>
<Selecting AllowRowSelect="true" />
</ClientSettings>

Here's a like to the documentation article:
http://www.telerik.com/help/aspnet-ajax/grid-selecting-row-with-click-client-side.html

Here's more info on how to style the selected row however you like:
http://www.telerik.com/help/aspnet-ajax/grid-appearance-customizing-row.html

Hope this helps,
-Gimmik
0
Anjali
Top achievements
Rank 1
answered on 12 May 2011, 10:30 PM
Hi Gimmik,

 I read that artile too before posting the question, but my problem is First I need to retain the row being bold after postback and also, I have another button at the top of the grid, if User  click on that button then it should only return few rows, fewer than the one that were returned originally with the row that was selected previously in bold.
The complete scenerio is  I have a Search text box at the top of the grid, user types something in that text box and results are returned in a gridview. Now he clicks on the linkbutton inside the grid. I need to return that particular row that he clciked to different color or bold, but there is another button at the top of the gridview that will return the row he clicked on and also the rows that are closely matching the rows that he selected so for e.g if he selected 123 in below grid

               row1    row2    row3
123         abc      def      ghi
456         pqr       def      ghi

Both 123 and 456 have "def": and "ghi" in common so I need to return both 123 and 456, but since he clicked 123, that particular row will be bolded.

please let me know if you have any example like that.
0
Accepted
Gimmik
Top achievements
Rank 1
answered on 13 May 2011, 06:07 PM
Hi Anjali,

This should be fairly simple to accomplish if you're comfortable with client-side programming. The simplest way to highlight a single row is via selection. The appearance of selected rows is very customizable. The issue seems to be persisting the selection after the grid rebinds. There is a nice document online on how to do exactly that. Basically you wire-up the client-side RowSelected event to save the unique ID of the currently selected row to a JavaScript array (in your case, "123"). Then you wire-up the RowCreated event to search through the array and set "set_selected(true)" for the current row when there is a match. You'll also need to wire-up the RowDeselected event. Here is the full document with sample code. I think this will work well for you.

http://www.telerik.com/help/aspnet-ajax/grid-persist-selected-rows-client-sorting-paging-grouping-filtering.html

Hope this helps!
-Gimmik
0
Anjali
Top achievements
Rank 1
answered on 13 May 2011, 06:49 PM
Thank you very much!! It worked!!

I really appreciate all your help!
0
Anjali
Top achievements
Rank 1
answered on 13 May 2011, 07:26 PM
It does n't work the way I want it to be. when I rebind the grid, the seletced row is gone.
Is their any way the selection is preserved after rebinding the grid.
0
Accepted
Tsvetina
Telerik team
answered on 18 May 2011, 08:51 AM
Hello Anjali,

You would need to use some custom logic in order to persist the selected row on rebind. Sample implementation is available here:
Persisting the selected rows server-side on sorting/paging/filtering/grouping

Best wishes,
Tsvetina
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Tags
Grid
Asked by
Anjali
Top achievements
Rank 1
Answers by
Gimmik
Top achievements
Rank 1
Anjali
Top achievements
Rank 1
Tsvetina
Telerik team
Share this question
or