VB.NetControls

ASP.Net - ImageButton

This is an example of an image button - when clicked it will run the btnNoteGvFooterAdd_Click. Actually the onclick property is not really necessary. If you are using VS2008, then doubleclick the button and the source code window will create a method to hold the logic to execute when the button is pressed.

1
2
3
4
5
6
<asp:ImageButton ID="btnNoteFvAdd_Click" 
	runat="server" 
	OnClick="btnNoteGvFooterAdd_Click"
	ImageUrl="~/Images/Add.gif" 
	Text="Add"
	ValidationGroup="APNAdd" />

This is an example of an image button placed inside a databound container - like a formview or a gridview (bound to an ObjectDataSet). When you click it, it triggers the containers Insert function.

1
2
3
4
5
6
7
<asp:ImageButton ID="btnNoteFvAdd_Click" 
	runat="server" 
	CausesValidation="True" 
	CommandName="Insert"
	ImageUrl="~/Images/Add.gif" 
	Text="Add"
	ValidationGroup="APNAdd" />

it also is tied to a validation group. That means if there are any validator controls also associated to this group they will checked and if invalid cause the command to fail.

To convert an imagebutton into a javascript button

Here is the button

1
2
3
4
5
6
7
<asp:ImageButton id="AssetIDLookupImageButton" 
    runat="server" 
    Width="16px" 
    ToolTip="Perform an asset lookup"
    Height="16px" 
    ImageUrl="zoom.gif">
</asp:ImageButton>

It should look like a regular button.

Here’s some script

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
Dim str As String _
    = vbCrLf & "<script> " & vbCrLf _
    & " function LookupID() " & vbCrLf _
    & " {	var assetType;" & vbCrLf _
    & "     if (document.forms[0].all('" & AssetTypeSelectorRadioButtonList.ClientID & "_0').checked) " & vbCrLf _
    & "         assetType='Manhole'; " & vbCrLf _
    & "     if (document.forms[0].all('" & AssetTypeSelectorRadioButtonList.ClientID & "_1').checked) " & vbCrLf _
    & "         assetType='ServiceLine'; " & vbCrLf _
    & "     if (document.forms[0].all('" & AssetTypeSelectorRadioButtonList.ClientID & "_2').checked) " & vbCrLf _
    & "         assetType='SewerLine'; " & vbCrLf _
    & "     var href='Lookup_All_modal.aspx' " & vbCrLf _
    & " 		+ '?AssetCode=' + document.forms[0].all('" & AssetIDTextBox.ClientID & "').value  " & vbCrLf _
    & " 		+ '&AssetType;=' + assetType" & vbCrLf _
    & " 		; " & vbCrLf _
    & " 	var args=''; " & vbCrLf _
    & " 	var X = window.showModalDialog(href, args, 'dialogHeight: 550px; dialogWidth:650px; resizable:yes; scroll:yes; status:yes; '); " & vbCrLf _
    & "     if (X )  " & vbCrLf _
    & " 	{	args = X.split('|'); " & vbCrLf _
    & " 		document.forms[0].all('" & AssetIDTextBox.ClientID & "').value=args[0]; " & vbCrLf _
    & " 	} " _
    & " } " _
    & " </script> "

' you want to do this
'    if (document.forms[0].all('" & AssetTypeSelectorRadioButtonList.ClientID & "').options[1].selected) " & vbCrLf 
' but what's rendered is individual radio controls.
' so then you want to do this
'    if (document.forms[0].all('" & AssetTypeSelectorRadioButtonList.items(1).ClientID & "').selected) " & vbCrLf 
' but an item doesn't have a client id

Page.RegisterStartupScript("LookupID", str)
 AssetIDLookupImageButton.Attributes.Add("onclick", "LookupID(); return false;")

Skins - themes - etc

This section should probably be placed elsewhere.

I have a PreInit function

1
2
3
4
5
6
7
8
9
10
11
Protected Sub Page_PreInit(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreInit

    'Dim theme As String = Profile("Theme")

    Dim theme As String = bl_Staff_Profile.getValue("Theme")

    If theme = "" Then Return

    Page.Theme = theme

End Sub

This function will set the page theme each time it is refreshed.

Buttons seem to be an issue. And the issue is … how can I have my buttons (ok image buttons) match the theme that I am presenting.

The answer is … it’s doable.

Step one - modify your image button to include a skin designator.

1
2
3
4
5
<asp:ImageButton 
    ID="imgDelete" 
    runat="server" 
    ImageUrl="~/Graphics/cancel.gif" 
    SkinID="Delete" />

Then you define that skinid

1
2
3
4
5
6
<asp:ImageButton 
            SkinID="Delete"
            runat="server" 
            ImageUrl="Graphics/Delete.gif" 
            Text="Delete" 
            ToolTip="Delete Record" />

It turns out … the skin image url will override your the buttons definition.