Button images in DataGrid editing

  • Thread starter Thread starter tshad
  • Start date Start date
T

tshad

Is there a way to use your own image in place of the automatic one that ASP
uses when doing editing in your DataGrid pages?

We already have a style of button we are using and would like to be
consistant.

Thanks,

Tom.
 
tshad said:
Is there a way to use your own image in place of the automatic one that ASP
uses when doing editing in your DataGrid pages?

We already have a style of button we are using and would like to be
consistant.
Click to expand...

Tom, are you using an EditCommandColumn for the Edit/Update/Cancel
buttons in the DataGrid, and are wanting to replace those with a custom
image file? If this is the case, all you have to do is set the
EditText, CancelText, UpdateText properties of the EditCommandColumn to
the appropriate HTML (i.e., <img src=edit.gif>, or what have you).

If you are wanting, instead, to apply a CSS style (which you last
sentence makes it sound like), see this FAQ:
http://datawebcontrols.com/faqs/ButtonColumns/CssClassForButtons.shtml

Happy Programming!

--

Scott Mitchell
(e-mail address removed)
http://www.4GuysFromRolla.com

* When you think ASP.NET, think 4GuysFromRolla.com!
 
Scott Mitchell said:
Tom, are you using an EditCommandColumn for the Edit/Update/Cancel buttons
in the DataGrid, and are wanting to replace those with a custom image
file? If this is the case, all you have to do is set the EditText,
CancelText, UpdateText properties of the EditCommandColumn to the
appropriate HTML (i.e., <img src=edit.gif>, or what have you).
Click to expand...

Yes.
<asp:EditCommandColumn EditText="Edit Info"
visible="true"
ButtonType="PushButton"
UpdateText="Update" CancelText="Cancel" />

Where would I put the imgs? I assume I would take out the EditText,
UpdateText and CancelText. Where would I put it if it were Edit.png,
Update.png and Cancel.png?

Where is a good place to find properties for each object (DataGrid,
EditCommandColumn etc)? I am always scrambling to find out how to set a
background or font property and the names are always different depending
whether you are using CSS or HTML or ASP.NET.
If you are wanting, instead, to apply a CSS style (which you last sentence
makes it sound like), see this FAQ:
http://datawebcontrols.com/faqs/ButtonColumns/CssClassForButtons.shtml
Click to expand...

I am looking at this also. At the moment, I need a quick and dirty way to
do this.

Thanks,

Tom
 
tshad said:
Yes.
<asp:EditCommandColumn EditText="Edit Info"
visible="true"
ButtonType="PushButton"
UpdateText="Update" CancelText="Cancel" />

Where would I put the imgs? I assume I would take out the EditText,
UpdateText and CancelText. Where would I put it if it were Edit.png,
Update.png and Cancel.png?
Click to expand...

Where is a good place to find properties for each object (DataGrid,
EditCommandColumn etc)? I am always scrambling to find out how to
Click to expand...
set > a background or font property and the names are always different
depending whether you are using CSS or HTML or ASP.NET.
Click to expand...

The technical documentation's a good start. If you download the .NET
SDK, or if you have Visual Studio .NET installed on your computer, you
have an offline documentation resource. There's also Google, MSDN, etc.
For example, to find the DataGrid properties just Google using:

site:http://msdn.microsoft.com DataGrid class

http://www.google.com/search?source...site:http://msdn.microsoft.com+DataGrid+class

Whose first link is:
http://msdn.microsoft.com/library/d...fSystemWebUIWebControlsDataGridClassTopic.asp

Also, if you're going to be doing a lot of work with the DataGrid, might
I suggest you pick up a copy of my book, ASP.NET Data Web Controls Kick
Start? It's 350+ pages on nothin' but the DataGrid, DataList, and Repeater:

Sample Chapter: http://www.4guysfromrolla.com/webtech/chapters/ASPDWC/
Buy it: http://www.4guysfromrolla.com/aspscripts/Goto.asp?ID=148

Happy Programming!

--

Scott Mitchell
(e-mail address removed)
http://www.4GuysFromRolla.com

* When you think ASP.NET, think 4GuysFromRolla.com!
 
Scott Mitchell said:
set > a background or font property and the names are always different

The technical documentation's a good start. If you download the .NET SDK,
or if you have Visual Studio .NET installed on your computer, you have an
offline documentation resource. There's also Google, MSDN, etc. For
example, to find the DataGrid properties just Google using:

site:http://msdn.microsoft.com DataGrid class

http://www.google.com/search?source...site:http://msdn.microsoft.com+DataGrid+class

Whose first link is:
http://msdn.microsoft.com/library/d...fSystemWebUIWebControlsDataGridClassTopic.asp
Click to expand...

That helps a lot.
Also, if you're going to be doing a lot of work with the DataGrid, might I
suggest you pick up a copy of my book, ASP.NET Data Web Controls Kick
Start? It's 350+ pages on nothin' but the DataGrid, DataList, and
Repeater:

Sample Chapter: http://www.4guysfromrolla.com/webtech/chapters/ASPDWC/
Buy it: http://www.4guysfromrolla.com/aspscripts/Goto.asp?ID=148
Click to expand...

Already have it and use it and really like it.

I was just looking for someway to have at my fingertips a list of properties
and methods of the controls that I can quickly access to get the correct
spelling or format of a particular property. For example: do I use bkground
or background or color or font-color.

Thanks,

Tom
 
But guys if i do (Does the image has to be in "PNG" and not "GIF":-

<asp:EditCommandColumn EditText="<img src='Edit.png'>" />

it works but when i DO

<asp:EditCommandColumn
HeaderText="Editing"
EditText="<img src='im_cancel.gif'>"
UpdateText="Update"
CancelText="Cancel"
ButtonType="PushButton" />
IT DOESN"T?
 
I find that it works, but it also puts a blue border around it for some
reason.

If I have it as an imagebutton it looks fine with no border around it:

<asp:ImageButton ID="ExpandButton" runat="server"
Font-Size="2" ImageUrl="../images/edit.png" Width="16" Height="16"
CommandName="Select" AlternateText="Click here to see
details"></asp:ImageButton>

If I have it as part of the EditCommandColumn I get this blue border. The
background colors are grey and orange that alternate.

<asp:EditCommandColumn EditText="<img
src='..\images\Edit.png' >" visible="true"
ButtonType="LinkButton"
UpdateText="<img src='..\images\update.png'>"
CancelText="<img src='..\images\Cancel.png'>" />

The background colors are exactly the same for the ImageButton.

There is no border if I use the normal edittext button.

Why the border?

Thanks,

Tom.
 
Hi Tom,
You are right.But if you don't want the border do border='0' like
below.
Patrick
<asp:EditCommandColumn EditText="<img
src='..\images\Edit.png' >" visible="true"
ButtonType="LinkButton"
UpdateText="<img src='..\images\update.png' border='0'>"
CancelText="<img src='..\images\Cancel.png' border='0'>" />
 
naija naija said:
Hi Tom,
You are right.But if you don't want the border do border='0' like
below.
Patrick
<asp:EditCommandColumn EditText="<img
src='..\images\Edit.png' >" visible="true"
ButtonType="LinkButton"
UpdateText="<img src='..\images\update.png' border='0'>"
CancelText="<img src='..\images\Cancel.png' border='0'>" />
Click to expand...

That did it.

Thanks,

Tom.
 
Back
Top