HorizontalAlign in the explorer's grid

3 posts, 1 answers
  1. Tomasz M.Lipiński
    Tomasz M.Lipiński avatar
    71 posts
    Member since:
    Nov 2009

    Posted 24 Mar 2010 Link to this post

    I've tried to set the HorizontalAlign of the "Size" column to "Right":
    GridColumn c = theExplorer.Grid.Columns.FindByUniqueNameSafe("Size");  
    if (c != null)  
      c.ItemStyle.HorizontalAlign = HorizontalAlign.Right;  
      c.HeaderStyle.HorizontalAlign = HorizontalAlign.Right;  
    It works but... up to the 11th row (starting with 1). The 12th row is an invisible "No record to display" row and starting from the 13th row the alignment is "Left". It is so in the case of any column, not "Size" only.
    See the attached print-screens of the markup and its result.
    Could you do something with it :-) ?


    PS. I'm using 2009 Q3 and "Simple" skin - if it matters.
  2. Answer
    Lini avatar
    2144 posts

    Posted 29 Mar 2010 Link to this post

    Hello Tomasz,

    The problem happens because the grid in the file explorer control uses client-side binding. The properties you set from the server are only applied to the rows that are rendered there (in this case 11 rows). The rest (rows 12 and up) are created dynamically in the browser when they are needed. There are two possible workarounds for this issue.

    You can try setting the PageSize property of the File Explorer to a larger value (e.g. 100). This way the grid will render 100 instead of 11 rows on the server and they all will get the correct alignment. The drawback from this setting is that the 100 rows will be part of the page HTML so the page might load a bit slower than without setting PageSize.

    As an alternative, you can attach a handler for the grid's client rowDataBound event and add the alignment manually there using JavaScript. See the following grid demo for more details - https://demos.telerik.com/aspnet-ajax/grid/examples/client/databinding/defaultcs.aspx

    Best wishes,
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. DevCraft R3 2016 release webinar banner
  4. Tomasz M.Lipiński
    Tomasz M.Lipiński avatar
    71 posts
    Member since:
    Nov 2009

    Posted 30 Mar 2010 Link to this post

    OK. I've implemented the second suggestion - something like that:
    <style type="text/css">  
    This CSS rule is programmatically created on the page ("fileMain" is the ClientID of my file explorer; "fileMain_grid" is the ClientID of its grid).
    function onRowDataBound(sender, args) {  
      var cols = args.get_item().get_parent().get_columns();  
      var i;  
      for (i = 0; i < cols.length; i++) {  
        var name = cols[i].get_uniqueName();  
        var className = args.get_item().get_cell(name).className;  
        var newClassName = sender.ClientID + "_" + name;  
        if (className.indexOf(newClassName) == -1)  
          args.get_item().get_cell(name).className += " " + newClassName;  
    This ClientEvents.OnRowDataBound handler sets the appropriate className value to each column (therefore I can programmatically configure any column without changing this handler).
    And it works fine - also for the rows bound server side.

    Thanks for tips.
Back to Top