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

ItemStyle-Wrap and Vertical Scroll bar

2 Answers 191 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Antony asked on 11 Feb 2009, 03:45 PM

I was binding my RADGrid on the server and I had set ItemStyle-Wrap to false; this worked perfectly. I am now binding my data on the client instead - I'm not mixing the two - and I can't seem to get ItemStyle-Wrap to work as it did. I'm guessing that the <ItemStyle> tag only works on server-side so my question is, how can I achieve the same thing on the client? NB. I've tried using <nobr> in the DataFormatString attribute but

1] it didn't work
2] I want the column width to be fixed

My RadGrid is contained within a splitter pane. The vertical scroll bar does not initially show after data has been bound, it only becomes visible after I hover my mouse over the splitter bar of the splitter control the grid is contained in. i.e. in order to get the scroll bar to show I have to hover my mouse over the splitter bar.

My data is fetched from a webservice

function getSearch(id)  
        if(id.indexOf('str') > -1)  
function SucceededGetSearch_Callback(result,id)  
        var grContent = $find('<%= grContent.ClientID %>');  
        if(!grContent) return;  
        var masterTable = grContent.get_masterTableView();  
        if(!masterTable) return;  
        // we have one radgrid and mulitple tabs
        // each time a tab is selected the data for that tab
        // is loaded into the grid and the scrollbar position that was
        // saved the last time the user was on the selected tab is retrieved

        var scrollPos = GetSetting(id + 'Scroll');  
            if(scrollPos == null) scrollPos = 1;  
        document.getElementById('<%= grContent.ClientID%>_GridData').scrollTop = scrollPos;  
function grContent_RowDataBound(sender, args)  
        args.get_item().get_cell("Title").innerHTML = args.get_dataItem()["Heading"];  
        args.get_item().get_cell("ContentType").innerHTML = args.get_dataItem()["TypeCode"].Name;  
        var isRead = args.get_dataItem()["Reading"];  
        var imgFlag = args.get_item().get_cell("Flag");  
        var id = args.get_dataItem()["ID"];  
        var img = document.createElement('img');  
        img.onmouseover = flagButton_Over;  
        img.onmouseout= flagButton_Out;  
        img.onclick= flagButton_Click;  = id;  
           img.src = "../Images/noFlag.png";  
            img.src = "../Images/flag2.png";  
<telerik:RadGrid ID="grContent" runat="server" 
                 Skin="Pab3" EnableEmbeddedSkins="false" GridLines="None" Width="100%" Height="100%" > 
                    <MasterTableView AutoGenerateColumns="false" ShowHeadersWhenNoRecords="true" EnableNoRecordsTemplate="true" TableLayout="Fixed" ClientDataKeyNames="ID" DataKeyNames="ID" Width="100%">  
                            <telerik:GridBoundColumn UniqueName="Flag" HeaderStyle-Wrap="false" HeaderStyle-Width="5%"></telerik:GridBoundColumn> 
                            <telerik:GridBoundColumn UniqueName="Title" HeaderText="Title" HeaderStyle-Wrap="false" HeaderStyle-Width="35%"></telerik:GridBoundColumn> 
                            <telerik:GridBoundColumn UniqueName="ContentType" HeaderText="Content Type" HeaderStyle-Wrap="false" HeaderStyle-Width="35%"></telerik:GridBoundColumn> 
                            <telerik:GridBoundColumn UniqueName="Date" HeaderText="Date" HeaderStyle-Wrap="false" HeaderStyle-Width="15%"></telerik:GridBoundColumn> 
                    <ClientSettings AllowColumnsReorder="False" AllowRowsDragDrop="true">  
                        <Resizing AllowColumnResize="true" EnableRealTimeResize="false"   
                        ResizeGridOnColumnResize="true" ClipCellContentOnResize="true" /> 
                        <Scrolling AllowScroll="True" UseStaticHeaders="True" ScrollHeight="1" /> 
                        <Selecting AllowRowSelect="True" EnableDragToSelectRows="true" /> 
                        <ClientEvents OnRowDragStarted="grContent_RowDragStarted" 
                                      OnRowDataBound="grContent_RowDataBound" /> 

Thanks in advance!


2 Answers, 1 is accepted

Sort by
Nikolay Rusev
Telerik team
answered on 16 Feb 2009, 12:44 PM
Hello Antony,

I am afraid that I am not able to replicate the issue locally. I suggest you to create small runnable application which demonstrate the problem and send it to us via formal support ticket. Thus we'll be able to debug it locally and help you more on the issue which you are currently facing.

Kind regards,
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Top achievements
Rank 1
answered on 18 Feb 2009, 02:25 PM

I've managed to solve the problem. As I'm not using the dataBind() function the DataFormatString attribute would not work. The code below, however, did.

var rowCell = masterTable.getCellByColumnUniqueName(rowDataItem,'Title');  
rowCell.innerHTML = '<nobr>' + result[i].Heading + '</nobr>'


Asked by
Top achievements
Rank 1
Answers by
Nikolay Rusev
Telerik team
Top achievements
Rank 1
Share this question