DataGrid header span 2 columns

Discussion in 'ASP .Net' started by tshad, Aug 22, 2005.

  1. tshad

    tshad Guest

    I have a datagrid where each column has both a label and a linkbutton.

    I need to have the label left justified and the linkbutton right justified.
    In HTML, I would have to set up 2 cells to do this.

    Is there a way to accomplish this in a DataGrid (and have the text span both
    columns).

    What I have is:

    <asp:TemplateColumn Visible="true" headerText="Bundle(10):"
    ItemStyle-Width="100" ItemStyle-VerticalAlign="Top">
    <itemtemplate>
    <asp:Label ID="Bundle10" text='<%#
    String.Format("{0:$#,##0}",Container.DataItem("Bundle(10)"))%>'
    runat="server"/>
    <asp:linkButton ID="Bundle10Link" text='Buy' runat="server"/>
    </itemtemplate>
    </asp:TemplateColumn>

    I could make this into 2 TemplateColumns and but the HeaderText would only
    be over the 1st column. There is no Header-Colspan attribute.

    I also tried to have 2 itemTemplates inside the TemplateColumn, but I guess
    you can't do that, as when I tried it, it only showed the 2nd itemTemplate.

    Thanks,

    Tom
     
    tshad, Aug 22, 2005
    #1
    1. Advertising

  2. tshad

    Lucas Tam Guest

    "tshad" <> wrote in
    news::

    > I have a datagrid where each column has both a label and a linkbutton.
    >
    > I need to have the label left justified and the linkbutton right
    > justified. In HTML, I would have to set up 2 cells to do this.
    >
    > Is there a way to accomplish this in a DataGrid (and have the text
    > span both columns).


    You do this type of formatting in the OnItemDataBound Event.

    --
    Lucas Tam ()
    Please delete "REMOVE" from the e-mail address when replying.
    http://members.ebay.com/aboutme/coolspot18/
     
    Lucas Tam, Aug 22, 2005
    #2
    1. Advertising

  3. tshad

    tshad Guest

    "Lucas Tam" <> wrote in message
    news:Xns96BA85D75B70Fnntprogerscom@127.0.0.1...
    > "tshad" <> wrote in
    > news::
    >
    >> I have a datagrid where each column has both a label and a linkbutton.
    >>
    >> I need to have the label left justified and the linkbutton right
    >> justified. In HTML, I would have to set up 2 cells to do this.
    >>
    >> Is there a way to accomplish this in a DataGrid (and have the text
    >> span both columns).

    >
    > You do this type of formatting in the OnItemDataBound Event.


    But that is my problem.

    How would I do it?

    If it puts the label and linkbutton in the same cell, how do you tell it to
    align 1 left and 1 right?

    Or if you use 2 templateColumns, how do you tell the header to span 2
    columns?

    Thanks,

    Tom
    >
    > --
    > Lucas Tam ()
    > Please delete "REMOVE" from the e-mail address when replying.
    > http://members.ebay.com/aboutme/coolspot18/
     
    tshad, Aug 22, 2005
    #3
  4. tshad

    Lucas Tam Guest

    "tshad" <> wrote in
    news::

    > If it puts the label and linkbutton in the same cell, how do you tell
    > it to align 1 left and 1 right?


    You'll need to use CSS to align 2 items with 2 different alignments in the
    same cell.

    Otherwise use 2 cells (columns).

    --
    Lucas Tam ()
    Please delete "REMOVE" from the e-mail address when replying.
    http://members.ebay.com/aboutme/coolspot18/
     
    Lucas Tam, Aug 22, 2005
    #4
  5. tshad

    tshad Guest

    "Lucas Tam" <> wrote in message
    news:Xns96BA9DC94D66Enntprogerscom@127.0.0.1...
    > "tshad" <> wrote in
    > news::
    >
    >> If it puts the label and linkbutton in the same cell, how do you tell
    >> it to align 1 left and 1 right?

    >
    > You'll need to use CSS to align 2 items with 2 different alignments in the
    > same cell.


    I tried that:

    Here is the template Column:

    <asp:TemplateColumn Visible="true" headerText="Bundle(10):"
    ItemStyle-Width="90" ItemStyle-VerticalAlign="Top">
    <itemtemplate>
    <asp:Label ID="Bundle10ID" visible="false" text='<%#
    Container.DataItem("Bundle(10)ID")%>' runat="server"/>
    <asp:Label ID="Bundle10" CssClass="onleft" text='<%#
    String.Format("{0:$#,##0}",Container.DataItem("Bundle(10)"))%>'
    runat="server"/>
    <asp:linkButton ID="Bundle10Link" CssClass="onright"
    OnClick="GetPrice" text='Buy' runat="server"/>
    </itemtemplate>

    Here is the CSS:

    ..onright {text-align:right}
    ..onleft {text-align:left}


    Here is the output:

    <td valign="Top" style="width:90px;">
    <span id="JobPostingGrid__ctl3_Bundle10"
    class="onleft">$1,400</span>
    <a id="JobPostingGrid__ctl3_Bundle10Link" class="onright"
    href="javascript:__doPostBack('JobPostingGrid$_ctl3$Bundle10Link','')">Buy</a>
    </td>

    But it just puts the 2 objects next to each other.

    Am I using the wrong CSS?

    >
    > Otherwise use 2 cells (columns).


    Problem is the Header.


    Thanks,

    Tom
    >
    > --
    > Lucas Tam ()
    > Please delete "REMOVE" from the e-mail address when replying.
    > http://members.ebay.com/aboutme/coolspot18/
     
    tshad, Aug 22, 2005
    #5
  6. read this - it might help

    http://www.codeproject.com/aspnet/MergeDatagridHeader.asp

    --
    Regards

    John Timney
    ASP.NET MVP
    Microsoft Regional Director

    "tshad" <> wrote in message
    news:...
    >I have a datagrid where each column has both a label and a linkbutton.
    >
    > I need to have the label left justified and the linkbutton right
    > justified. In HTML, I would have to set up 2 cells to do this.
    >
    > Is there a way to accomplish this in a DataGrid (and have the text span
    > both columns).
    >
    > What I have is:
    >
    > <asp:TemplateColumn Visible="true" headerText="Bundle(10):"
    > ItemStyle-Width="100" ItemStyle-VerticalAlign="Top">
    > <itemtemplate>
    > <asp:Label ID="Bundle10" text='<%#
    > String.Format("{0:$#,##0}",Container.DataItem("Bundle(10)"))%>'
    > runat="server"/>
    > <asp:linkButton ID="Bundle10Link" text='Buy' runat="server"/>
    > </itemtemplate>
    > </asp:TemplateColumn>
    >
    > I could make this into 2 TemplateColumns and but the HeaderText would only
    > be over the 1st column. There is no Header-Colspan attribute.
    >
    > I also tried to have 2 itemTemplates inside the TemplateColumn, but I
    > guess you can't do that, as when I tried it, it only showed the 2nd
    > itemTemplate.
    >
    > Thanks,
    >
    > Tom
    >
     
    John Timney \(ASP.NET MVP\), Aug 22, 2005
    #6
  7. tshad

    tshad Guest

    "John Timney (ASP.NET MVP)" <> wrote in message
    news:...
    > read this - it might help
    >
    > http://www.codeproject.com/aspnet/MergeDatagridHeader.asp


    That's great.

    I didn't know you could muck around with the headers like that.

    The way I was going to solve it was to create a separate table just for the
    header (which also works), but this is definately a more elegant method.

    Solves the problem.

    Thanks,

    Tom
    >
    > --
    > Regards
    >
    > John Timney
    > ASP.NET MVP
    > Microsoft Regional Director
    >
    > "tshad" <> wrote in message
    > news:...
    >>I have a datagrid where each column has both a label and a linkbutton.
    >>
    >> I need to have the label left justified and the linkbutton right
    >> justified. In HTML, I would have to set up 2 cells to do this.
    >>
    >> Is there a way to accomplish this in a DataGrid (and have the text span
    >> both columns).
    >>
    >> What I have is:
    >>
    >> <asp:TemplateColumn Visible="true" headerText="Bundle(10):"
    >> ItemStyle-Width="100" ItemStyle-VerticalAlign="Top">
    >> <itemtemplate>
    >> <asp:Label ID="Bundle10" text='<%#
    >> String.Format("{0:$#,##0}",Container.DataItem("Bundle(10)"))%>'
    >> runat="server"/>
    >> <asp:linkButton ID="Bundle10Link" text='Buy' runat="server"/>
    >> </itemtemplate>
    >> </asp:TemplateColumn>
    >>
    >> I could make this into 2 TemplateColumns and but the HeaderText would
    >> only be over the 1st column. There is no Header-Colspan attribute.
    >>
    >> I also tried to have 2 itemTemplates inside the TemplateColumn, but I
    >> guess you can't do that, as when I tried it, it only showed the 2nd
    >> itemTemplate.
    >>
    >> Thanks,
    >>
    >> Tom
    >>

    >
    >
     
    tshad, Aug 23, 2005
    #7
  8. tshad

    nak

    Joined:
    May 4, 2012
    Messages:
    1
    Location:
    Ohio
    "There is no Header-Colspan attribute."
    Not at design time. You can get to it later.

    Use 2 columns and catch the ItemDataBound event for the grid. The code below gets rid of the third columnof the header and expands the second one to cover it.


    PrivateSub MyGrid_ItemDataBound(ByVal sender AsObject, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles MyGrid.ItemDataBound

    If e.Item.ItemType = ListItemType.Header Then
    'remove the third cell and make the second cell cover it
    e.Item.Cells.RemoveAt(2)
    e.Item.Cells(1).ColumnSpan = 2
    Return

    End If
    End Sub
     
    nak, May 4, 2012
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    1
    Views:
    6,197
    Ken Cox [Microsoft MVP]
    Jan 26, 2005
  2. Fulio Open

    Can span include span?

    Fulio Open, Jun 26, 2009, in forum: HTML
    Replies:
    5
    Views:
    552
    dorayme
    Jun 26, 2009
  3. Stéphane Klein
    Replies:
    2
    Views:
    1,768
    John Nagle
    Mar 30, 2010
  4. Stefan Behnel
    Replies:
    0
    Views:
    489
    Stefan Behnel
    Mar 29, 2010
  5. Dan Bishop

    DataGrid (body only) contained in <span>...</span> tags

    Dan Bishop, Jun 7, 2004, in forum: ASP .Net Datagrid Control
    Replies:
    2
    Views:
    279
    Kilic Beg
    Jun 7, 2004
Loading...

Share This Page