Solved

formatting button style within an EditCommandColumn

Posted on 2006-06-13
5
761 Views
Last Modified: 2011-10-07
I have the following style that I apply to all the buttons on my page.  I have not been able to format the buttons in the Datagrid's EditCommand Column.  My only options seem to be basic text or hyperlink or image.  I would like to apply the below effects so that my page design is the same accross the board.  Please help!!

--------------------------------------------------------------------------------------------------------------
<asp:Button id=btnDel Text="Delete" onmouseup="this.style.color='black';
this.style.backgroundColor='lightblue'" onmousedown="this.style.color='white';
this.style.backgroundColor='red'" onmouseover="this.style.color='black';
this.style.backgroundColor='lightblue'" style="WIDTH: 50px;      COLOR: white;
HEIGHT: 24px; BACKGROUND-COLOR: steelblue" onmouseout="this.style.color='white';
this.style.backgroundColor='steelblue'" CommandName="Delete" Runat="server"></asp:Button>
--------------------------------------------------------------------------------------------------------------
<asp:EditCommandColumn ButtonType="PushButton" UpdateText="Update" CancelText="Cancel" EditText="Edit">
</asp:EditCommandColumn>
--------------------------------------------------------------------------------------------------------------
0
Comment
Question by:Robb Hill
  • 3
  • 2
5 Comments
 
LVL 4

Expert Comment

by:recklez
ID: 16898127
I add the styles programatically for the EditCommandColumn buttons.

In your datagrid tag add an OnItemCreated attribute.
<asp:DataGrid ID="myDatagrid" runat="server" OnItemCreated="myDatagrid_ItemCreated" AutoGenerateColumns="false" ... </asp:DataGrid>



In your code implent the function with the name you specified (myDatagrid_ItemCreated) that handles the ItemCreated Event

Public Sub myDatagrid_ItemCreated(ByVal Sender As Object, ByVal e As DataGridItemEventArgs)

   'If this is an edit row.
   If (e.Item.ItemType = ListItemType.EditItem) Then
            'Add CSS style to the buttons
            Dim updateButton As Button = CType(e.Item.Cells(5).Controls(0), Button)
            updateButton.CssClass = "submit1"

            Dim cancelButton As Button = CType(e.Item.Cells(5).Controls(2), Button)
            cancelButton.CssClass = "submit1"

            Dim deleteButton As Button = CType(e.Item.Cells(6).Controls(0), Button)
            deleteButton.CssClass = "submit1"
            deleteButton.Attributes.Add("onClick", "return confirm('Are you sure you want to delete this Manager?');")
    End If

End Sub

Note that you must change the index of the Cells() depending on how many columns you have on your datagrid.
0
 
LVL 11

Author Comment

by:Robb Hill
ID: 16960363
This is pretty neat.....more specifically though....can I use the styles I mentioned above...when I am in my css editor I do not see the onmouseover and such events.....am I doing something wrong or are they unavailabe from a stylesheet.

Thanks.
0
 
LVL 4

Accepted Solution

by:
recklez earned 500 total points
ID: 16961441
You could use the styles mention above. If you want to register an event on the button like onmouseover or onmousedown
simmply add an attribute to the button like

myButton.Attributes.Add("onmouseover","this.style.color='black'")

You will not be able to view these effects in an editor because they are rendered at runtime.
0
 
LVL 11

Author Comment

by:Robb Hill
ID: 16962427
Very nice...I have been wondering what the trick was to this.  Thanks a million ...I mean 500 :D
0
 
LVL 4

Expert Comment

by:recklez
ID: 16962922
You are very welcome robbhill!
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
tutorial for ebay api 3 75
asp Google Map 2 55
WordPress: Debugging from my Windows 10 Desktop 6 61
Dreamweaver code color same as CS6 or CS2015 2 31
I've been asked to discuss some of the UX activities that I'm using with my team. Here I will share some details about how we approach UX projects.
Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
This tutorial walks through the best practices in adding a local business to Google Maps including how to properly search for duplicates, marker placement, and inputing business details. Login to your Google Account, then search for "Google Mapmaker…
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…

685 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