Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

DataGrid changes, combining multiple columns under one heading, adding text, adding mouse overs

Posted on 2004-08-03
7
Medium Priority
?
723 Views
Last Modified: 2009-07-29
I'd like help making a few changes to a typical datagrid. I haven't been able to search for tutorials for these changes, because I'm not exactly sure what to search for.

1. I'd like to combine three columns under one heading. For example, the heading should be called Description and the columns under it are grade, season, and year.

2. I'd like to add text in each cell along with the data from the database. For example, under one heading named 'Registration', the text should be 'starting date' with a date from one db column, and 'ending date' with a date from another db column.

3. I'd like to add a link column to the datagrid with an image that changes when the mouse goes over it.

4. I'd like to add a tooltip to the element that says something like 'click here to go to 'name'', with name being a value from the database.

I really appreciate any tips or links to some tutorials for these changes. Thanks.
0
Comment
Question by:tmhoang
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
7 Comments
 
LVL 25

Assisted Solution

by:nauman_ahmed
nauman_ahmed earned 200 total points
ID: 11706071
Hi,

You are talking about adding subheadings in datagrid right? The following tutorial will help you:

http://aspnet.4guysfromrolla.com/articles/072603-1.aspx

Best, Nauman
0
 
LVL 17

Assisted Solution

by:AerosSaga
AerosSaga earned 600 total points
ID: 11706129
This shows you how to create the calculated columns:

I would add a template column and make an itemdatabound subroutine to handle the OnItemDataBound event (put OnItemDataBound="DataGrid1_ItemDataBound" in the HTML source between the datagrid tags

Each time a row is added, it will call this subroutine and you can do math with each cell of the row(item)

    Protected Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound
         'assuming template column will be column #7 and the dropdown list is column 5 and the quantity is column 6
         e.item.cells(7).text = CStr(CDbl(e.item.cells(6).text) * CDbl(CType(e.item.cells(5).controls(0) ,DropDownList).SelectedItem.Text)
    End Sub

As for the mouseover effects, you will have to use javascript:

Regards,

Aeros
0
 
LVL 17

Expert Comment

by:AerosSaga
ID: 11706146
Heres the onclick bit:

<input type="hidden" name="__EVENTTARGET">
<input type="hidden" name="__EVENTARGUMENT">
<script language="javascript">
function __doPostBack(eventTarget, eventArgument)
{
      var theform = document.Form1;
      theform.__EVENTTARGET.value = eventTarget;
      theform.__EVENTARGUMENT.value = eventArgument;
      theform.submit();
}
</script>
__________________________________________________________________________________________________________-

Private Sub Page_Load(ByVal sender As System.Object,
ByVal e As System.EventArgs) Handles MyBase.Load
If Not Page.IsPostBack Then
   BindGrid()
End If
end Sub

Private Sub DataGrid1_ItemCreated
(ByVal sender As Object,
ByVal e As DataGridItemEventArgs)
Handles DataGrid1.ItemCreated
If e.Item.ItemType = ListItemType.Item
Or e.Item.ItemType = ListItemType.AlternatingItem
Or e.Item.ItemType = ListItemType.SelectedItem Then
e.Item.Attributes.Add
("onmouseover", "this.style.backgroundColor=
'beige';this.style.cursor='hand'")
e.Item.Attributes.Add
("onmouseout", "this.style.backgroundColor='white';")
e.Item.Attributes.Add
("onclick",
"javascript:__doPostBack
('" & "DataGrid1:" & "ctrl" & 
e.Item.ItemIndex & ":ctrl0','')")
End If
End Sub

Private Sub DataGrid1_SelectedIndexChanged
(ByVal sender As System.Object,
ByVal e As System.EventArgs)
Handles DataGrid1.SelectedIndexChanged
DataGrid1.SelectedItem.Attributes.Item("onmouseover") =
"this.style.cursor='hand'"
DataGrid1.SelectedItem.Attributes.Remove("onmouseout")
End sub

Regards,

Aeros
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 9

Expert Comment

by:noulouk
ID: 11706752
0
 

Author Comment

by:tmhoang
ID: 11709747
I found a solution for grouping columns under the heading by following the above links. Here's what I did:

public void dg_ItemCreated(object sender, DataGridItemEventArgs e)
{
      if (e.Item.ItemType == ListItemType.Header)
      {
            e.Item.Cells[2].Text = "Organization Name";
            e.Item.Cells[3].ColumnSpan = 2;
            e.Item.Cells[3].Text = "Location";
            e.Item.Cells.RemoveAt(4);
      }
}

I'm now working on the other problems. I'll return later. Thanks everybody.
0
 
LVL 9

Accepted Solution

by:
noulouk earned 800 total points
ID: 11709829
Part 3: you can use the custom button rollover server control:
http://aspnet.4guysfromrolla.com/articles/091703-1.aspx
0
 
LVL 2

Assisted Solution

by:waterhidden
waterhidden earned 400 total points
ID: 11714806


you can do such kind of operations in itemdatabound:

study on this piece of code,


    Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGrid1.ItemDataBound
        If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then
'normal rows (not head or footer)
            e.Item.Attributes.Add("onclick", "window.open('../TalepAyrinti.aspx?talepno=" & e.Item.Cells(0).Text & "','DisplayPhoto'," & _
            "'width=650,height=450,scrollbars=yes,status=no,toolbar=no,menubar=no,resizable=no,left=0,top=0')")

            e.Item.Attributes.Add("onmouseover", "this.style.cursor = 'hand';")

        ElseIf e.Item.ItemType = ListItemType.Footer Then
            e.Item.Cells(0).ColumnSpan = CInt(e.Item.Cells.Count)
            e.Item.Cells(0).Text = "Total: " & Me.DataGrid1.Items.Count
            For i = e.Item.Cells.Count - 1 To 1 Step -1
                e.Item.Cells.RemoveAt(i)
            Next

        End If
    End Sub
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
In this video you will find out how to export Office 365 mailboxes using the built in eDiscovery tool. Bear in mind that although this method might be useful in some cases, using PST files as Office 365 backup is troublesome in a long run (more on t…
Want to learn how to record your desktop screen without having to use an outside camera. Click on this video and learn how to use the cool google extension called "Screencastify"! Step 1: Open a new google tab Step 2: Go to the left hand upper corn…
Suggested Courses

618 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question