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

Horizontal scroll not appearing

2 Answers 93 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Kim
Top achievements
Rank 1
Kim asked on 30 Jan 2012, 11:49 PM

Have a look at http://www.iytworldwide.com/MFSchools.aspx

I edited my post because i was able to get the scroll bar to appear

However, If you go to the site and scroll left and right the performance is AWFUL.

2 Answers, 1 is accepted

Sort by
0
Kim
Top achievements
Rank 1
answered on 30 Jan 2012, 11:54 PM

Also can you guys do something about that little white box above the veritcal scroll, just right of the header? Looks icky.

Thanks 
0
Galin
Telerik team
answered on 02 Feb 2012, 01:00 PM
Hi Kim,

The gap above the scroll is a legacy from the first versions of RadControls for ASP.NET AJAX. We prefer not to change this appearance as we will have to introduce breaking changes which is not acceptable.

However, you can workaround it by making a new image exactly like a header and set it as background of RadGrid with CSS.  You can find a sample page in the attached file. (sample-grid_CSS_workaround.zip)

Also, you can workaround it by filling the gap with new elements, which are created with the following javascript and styled appropriately

Javascript
window.$ = $telerik.$;
function GridCreated(sender, arg)
{
    var tableMarkup = '<table cellSpacing="0" class="rgMasterTable rgClipCells">';
  
 
    var header = sender.get_masterTableViewHeader().get_element();
    $telerik.$('thead tr', header).each(function ()
    {
        var currEl = $telerik.$('th:first, td:first', this);
        tableMarkup += '<tr><' + currEl[0].tagName + ' class="' + currEl[0].className + '" style="height:' + currEl.height() + 'px"> </' + currEl[0].tagName + '></tr>';
    });
  
 
    tableMarkup += '</table>';
  
 
    $('.rgHeaderDiv').wrap('<div class="rgHeaderDiv rgHeaderDivWrapper" />')
    .parent()
    .append(tableMarkup);
}


CSS
.rgHeaderDivWrapper
{
    position: relative;  
}
  
 
.rgHeaderDivWrapper > .rgMasterTable
{
    position: absolute;
    top: 0;
    right: 0
}

Additionally, please refer to the following help topic about the RadGrid performance optimization
http://www.telerik.com/help/aspnet-ajax/grid-viewstate-reduction-techniques.html

Please check it out and let me know how it goes.

Regards,
Galin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Tags
Grid
Asked by
Kim
Top achievements
Rank 1
Answers by
Kim
Top achievements
Rank 1
Galin
Telerik team
Share this question
or