Gridview right border on a per-column basis

[pickedaname]

Hi, I am trying to figure out how to either insert a 'spacer' between columns
(which I can control width and color) or give a column/cell a border only on
the right side. Can I do this in .net 2, or would I have to use css? If so,
how do I apply the style to just the cells or columns I want? I have certain
catagories of columns grouped in the gridview and need this 'line' between
groups of columns to make it easier to read the gridview for the users.
Thanks

 

[Walter Wang [MSFT]]

Hi,

Thank you for your post.

Based on my understanding, the question is: how to insert a 'spacer'
between columns so that certain categories of columns can be grouped. If
I've misunderstood anything, please free free to post here.

I suggest using an empty column between certain columns and set its width
or background color. For example:

<asp:TemplateField>
<HeaderStyle Width=100px BackColor="blue" />
<ItemStyle BackColor="blue" />
</asp:TemplateField>

Please note, since the GridView generated html is using table, to make the
width settings work, you may need to set a total width on the GridView tag
and set all other columns' width. Another approach may be using some spaces
to set as the empty column's HeaderText property.

Hope this helps. Please feel free to post here if anything is unclear.


Regards,
Walter Wang
Microsoft Online Community Support

==================================================
When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.

 

[pickedaname]

Hi,
empty column was the 1st thing I tried. Can set color, but the width doesnt
go narrow enough to look like a cell border (like in Excel)
please help, Thanks.

 

[Walter Wang [MSFT]]

Hi,

Thank you for your update.

How about this approach:

protected void GridView1_RowCreated(object sender, GridViewRowEventArgs
e)
{
e.Row.Cells[0].Style.Add("border-right-width", "3px");
e.Row.Cells[0].Style.Add("border-right-color", "blue");
}


Regards,
Walter Wang
Microsoft Online Community Support

==================================================
When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.

 

[pickedaname]

Hi Walter,
Is this referring to a css style which gets applied while the table is being
sent as html?, the "border-right-width" I am not finding in any class. How do
I apply this?

 

[pickedaname]

e.Row.Cells(1).Style.Add("border-right-color", "LightGray")

results in
Specified argument was out of the range of valid values.
Parameter name: index . I am assuming it is referring to the cells index.
I don't see how 1 could be out of range. I am using the pager.

 

[Walter Wang [MSFT]]

Hi,

Thank you for your update.

The "border-right-width" and "border-right-color" are standard CSS 2.1
attributes.

And you need to check for the row type in the RowCreated event:

If e.Row.RowType = DataControlRowType.Header Or e.Row.RowType =
DataControlRowType.DataRow Then
e.Row.Cells(1).Style.Add("border-right-width", "3px")
e.Row.Cells(1).Style.Add("border-right-color", "blue")
End If

Hope this helps. Please feel free to post here if anything is unclear.

Regards,
Walter Wang
Microsoft Online Community Support

==================================================
When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.

 

[pickedaname]

Hi Walter,
I did as you said. No exceptions but border is not being applied to the html
table upon output. I tried it also in the render event and nothing there
either. I am not currently applying any css files to the site.
Any other suggestions?
Thanks

 

[Walter Wang [MSFT]]

Hi,

Thank you for your update.

Looks like I forgot to set the style to 'solid':

Protected Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowCreated
If e.Row.RowType = DataControlRowType.Header Or e.Row.RowType =
DataControlRowType.DataRow Then
e.Row.Cells(1).Style.Add("border-right-width", "5px")
e.Row.Cells(1).Style.Add("border-right-color", "blue")
e.Row.Cells(1).Style.Add("border-right-style", "solid")
End If
End Sub



Regards,
Walter Wang
Microsoft Online Community Support

==================================================
When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.

 

[pickedaname]

Thank you Walter, it worked like a champ.

 

[Walter Wang [MSFT]]

Thank you for your update.

I'm glad the suggestion worked.

Have a nice day!

Regards,
Walter Wang
Microsoft Online Community Support

==================================================
When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.