Styling problem centering a CheckBox column created dynamically

5 posts, 1 answers
  1. Paul
    Paul avatar
    29 posts
    Member since:
    Aug 2011

    Posted 12 Oct 2011 Link to this post

    I have been try to center a dynamically create checkbox column with the checkbox centered. If you create it in design time, it is centered. When I create it dynamically in the Page_Load event I get the checkbox left justified. My code behind is in VB. I created it as follows:

    Dim checkBoxColumn As NewTreeListCheckBoxColumn()

    treeList.Columns.Add(checkBoxColumn)

    checkBoxColumn.DataField = "Accessibility"

    checkBoxColumn.UniqueName = "Accessibility"

    checkBoxColumn.HeaderText = "Accessibility"

    checkBoxColumn.ItemStyle.HorizontalAlign = HorizontalAlign.Center

    It works, just not centered. Any ideas as to why I cannot center the checkbox?

    Thanks,
    Paul

  2. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 17 Oct 2011 Link to this post

    Hello Paul,

    Thank you for contacting us.

    Our recommendation is to use CSS to apply styles to the RadTreeList control instead of the HTML properties inside the control declaration. So, in this scenario you could use the following in order to center the checkbox column:
    Dim checkBoxColumn As New TreeListCheckBoxColumn()
    treeList.Columns.Add(checkBoxColumn)
    checkBoxColumn.DataField = "BoolVal"
    checkBoxColumn.UniqueName = "BoolColumn"
    checkBoxColumn.HeaderText = "Boolean"
    checkBoxColumn.ItemStyle.CssClass = "centered"
    <style type="text/css">
        .centered
        {
            text-align: center;
        }
    </style>

    Depending on your scenario, you may need to provide higher spcificity for the CSS selector in order to apply it.

    Regards,
    Tsvetina
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Paul
    Paul avatar
    29 posts
    Member since:
    Aug 2011

    Posted 17 Oct 2011 Link to this post

    Thanks for the reply.

    The way my asp page loads, until the cascading combo boxes have valid selections, the TreeList’s DataSource is an empty table. Once the combo boxes have valid selections, the TreeList will have a non-empty DataSource and data to display. If I initially load the TreeList with data, the centering works. If I initially pass an empty DataSource and later, on a postback, set the DataSource to a non-empty data source, centering does not work.

    Thanks,
    Paul

  5. Answer
    Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 18 Oct 2011 Link to this post

    Hello Paul,

    I managed to replicate the problem which you are talking about and it was fixed on my side by setting the CssClass on PreRender. This way you should ensure that it is set each time and is late enough, so that it does not get overwritten:
    Protected Sub treeList_PreRender(ByVal sender As Object, ByVal e As EventArgs) Handles treeList.PreRender
        treeList.GetColumn("BoolColumn").ItemStyle.CssClass = "centered"
    End Sub


    All the best,
    Tsvetina
    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
  6. Paul
    Paul avatar
    29 posts
    Member since:
    Aug 2011

    Posted 18 Oct 2011 Link to this post

    Thanks,

    The PreRender event was the place to perform the column alignment. I didn't need the CssClass, your "ItemStyle.HorizontalAlign" works in the PreRender. 
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017