Textbox backcolor change (receiving focus) on Webform...help

  • Thread starter Thread starter trint
  • Start date Start date
T

trint

Ok,
Is their an easy way to get textboxes in webforms to change backcolor
when receiving focus? Any help or links are appreciated.
Thanks,
Trint
 
Trint,

You would have to use javascript to do this. There should be an event
for obtaining focus (onenter, I believe). In there, you would set the style
for the textbox so that the background color (backcolor on style, I believe)
is the color you want.

Here is a little sample script:

<html>
<body>
<input type="text"
onfocus="javascript:this.style.background='#090909';"
onblur="javascript:this.style.background='#FFFFFF';">

<input type="button">
</body>
</html>


Hope this helps.
 
Where would I put that in my code? (this code:)

public static void setFocus(Page page, string controlID)
{

string javascript = string.Format( @"<script language=""javascript"">

var called = false;

if(document.body.onfocus)
orig_document_body_onfocus = document.body.onfocus;

document.body.onfocus = document_body_onfocus;

function setFocus()
{{
var control = document.getElementById(""{0}"");
if(control)
control.focus();
}}


function orig_document_body_onfocus(){{}}

function document_body_onfocus ()
{{
if( !called )
{{
called = true;
setFocus();
}}

orig_document_body_onfocus();
}}



if( window.__smartNav && window.__smartNav.restoreFocus)
{{
orig_window__smartNav_restoreFocus = window.__smartNav.restoreFocus;
window.__smartNav.restoreFocus = window__smartNav_restoreFocus;
}}

function orig_window__smartNav_restoreFocus(){{}}

function window__smartNav_restoreFocus()
{{
setFocus();
orig_window__smartNav_restoreFocus
}}


</script>", controlID);

page.RegisterStartupScript("focus", javascript);

}// end setFocus

public static void setFocus(WebControl control)
{
setFocus(control.Page, control.ID);

}// end setFocus

public static void setFocus(HtmlControl control)
{
setFocus(control.Page, control.ID);

}// end setFocus

thanks

..Net programmer
(e-mail address removed)
 
Trint,

You aren't going to put that in your C# code, it's going to be
javascript that is run on the client side. You don't want to do this kind
of thing on the server side, since it would require a postback, just to
change the background color on a textbox.
 
trint,

Why not just place it on the ASPX page, and not in your C# code? It's
javascript to be run on the ^client^ side. You don't place this in your C#
code.
 
I tried that like this and got nothing.

<%@ Page language="c#" Codebehind="AdminMenu.aspx.cs"
AutoEventWireup="false" Inherits="TravelTesttoEcoDev1.AdminMenu" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>AdminMenu</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema
content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<input
type="text" onfocus="javascript:this.style.background='#090909'; onblur="javascript:this.style.­background='#FFFFFF';"></script>
<form id="Form1" method="post" runat="server"><asp:panel id=Panel2
style="Z-INDEX: 100; LEFT: 0px; POSITION: absolute; TOP: 0px"
runat="server" Width="568px" Height="96px"
BackImageUrl="http://mis12/travel10/travelmember_ban.jpg"
Wrap="False"></asp:panel><asp:label id=Label7 style="Z-INDEX: 101;
LEFT: 288px; POSITION: absolute; TOP: 104px" runat="server"
Width="184px" Font-Italic="True" Font-Size="X-Large"
ForeColor="CornflowerBlue" Font-Bold="True">Admin
Menu</asp:label><asp:button id=Button5 style="Z-INDEX: 102; LEFT: 80px;
POSITION: absolute; TOP: 248px" runat="server" Width="200px"
ForeColor="CornflowerBlue" Font-Bold="True" Text="Travel Dollars Earned
Report" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:label id=Label8 style="Z-INDEX:
103; LEFT: 64px; POSITION: absolute; TOP: 208px" runat="server"
Width="240px" Font-Italic="True" Font-Size="Large"
ForeColor="CornflowerBlue" Font-Bold="True">View and Print
Reports</asp:label><asp:button id=Button1 style="Z-INDEX: 104; LEFT:
80px; POSITION: absolute; TOP: 280px" runat="server" Width="200px"
ForeColor="CornflowerBlue" Font-Bold="True" Text="Select Date Range
Report" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:label id=Label1 style="Z-INDEX:
105; LEFT: 480px; POSITION: absolute; TOP: 208px" runat="server"
Width="216px" Font-Italic="True" Font-Size="Large"
ForeColor="CornflowerBlue" Font-Bold="True">Actions and
Changes</asp:label><asp:button id=Button4 style="Z-INDEX: 106; LEFT:
488px; POSITION: absolute; TOP: 248px" runat="server" Width="200px"
ForeColor="CornflowerBlue" Font-Bold="True" Text="Transfer Travel
Dollars" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button6
style="Z-INDEX: 107; LEFT: 488px; POSITION: absolute; TOP: 280px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Spend Travel Dollars" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button7
style="Z-INDEX: 108; LEFT: 488px; POSITION: absolute; TOP: 312px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Create a New Event" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button8
style="Z-INDEX: 109; LEFT: 488px; POSITION: absolute; TOP: 344px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Edit or Delete an Event" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button9
style="Z-INDEX: 110; LEFT: 488px; POSITION: absolute; TOP: 376px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Change Products" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button10
style="Z-INDEX: 111; LEFT: 80px; POSITION: absolute; TOP: 312px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Review Products" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button11
style="Z-INDEX: 112; LEFT: 488px; POSITION: absolute; TOP: 408px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="End of Month Processing" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:label id=Label4 style="Z-INDEX:
113; LEFT: 576px; POSITION: absolute; TOP: 8px" runat="server"
Width="152px" Font-Italic="True" ForeColor="CornflowerBlue"
Font-Bold="True">You are logged in as:</asp:label><asp:label id=Label6
style="Z-INDEX: 114; LEFT: 584px; POSITION: absolute; TOP: 32px"
runat="server" Width="224px" Font-Italic="True" Font-Size="Large"
ForeColor="CornflowerBlue" Font-Bold="True"></asp:label><asp:Label
id=Label2 style="Z-INDEX: 115; LEFT: 368px; POSITION: absolute; TOP:
312px" runat="server" Width="96px" Font-Size="Larger" ForeColor="Red"
Font-Bold="True" Font-Names="Agency FB">Try this
one---></asp:Label><asp:Label id=Label3 style="Z-INDEX: 116; LEFT:
296px; POSITION: absolute; TOP: 248px" runat="server" Width="96px"
Font-Bold="True" ForeColor="Red" Font-Size="Larger" Font-Names="Agency
FB"><---Try this one</asp:Label>
</form>

</body>
</HTML>
 
trint,

I would remove the </script> element from after the input element.


--
- Nicholas Paldino [.NET/C# MVP]
- (e-mail address removed)

I tried that like this and got nothing.

<%@ Page language="c#" Codebehind="AdminMenu.aspx.cs"
AutoEventWireup="false" Inherits="TravelTesttoEcoDev1.AdminMenu" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>AdminMenu</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema
content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<input
type="text" onfocus="javascript:this.style.background='#090909';
onblur="javascript:this.style.­background='#FFFFFF';"></script>
<form id="Form1" method="post" runat="server"><asp:panel id=Panel2
style="Z-INDEX: 100; LEFT: 0px; POSITION: absolute; TOP: 0px"
runat="server" Width="568px" Height="96px"
BackImageUrl="http://mis12/travel10/travelmember_ban.jpg"
Wrap="False"></asp:panel><asp:label id=Label7 style="Z-INDEX: 101;
LEFT: 288px; POSITION: absolute; TOP: 104px" runat="server"
Width="184px" Font-Italic="True" Font-Size="X-Large"
ForeColor="CornflowerBlue" Font-Bold="True">Admin
Menu</asp:label><asp:button id=Button5 style="Z-INDEX: 102; LEFT: 80px;
POSITION: absolute; TOP: 248px" runat="server" Width="200px"
ForeColor="CornflowerBlue" Font-Bold="True" Text="Travel Dollars Earned
Report" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:label id=Label8 style="Z-INDEX:
103; LEFT: 64px; POSITION: absolute; TOP: 208px" runat="server"
Width="240px" Font-Italic="True" Font-Size="Large"
ForeColor="CornflowerBlue" Font-Bold="True">View and Print
Reports</asp:label><asp:button id=Button1 style="Z-INDEX: 104; LEFT:
80px; POSITION: absolute; TOP: 280px" runat="server" Width="200px"
ForeColor="CornflowerBlue" Font-Bold="True" Text="Select Date Range
Report" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:label id=Label1 style="Z-INDEX:
105; LEFT: 480px; POSITION: absolute; TOP: 208px" runat="server"
Width="216px" Font-Italic="True" Font-Size="Large"
ForeColor="CornflowerBlue" Font-Bold="True">Actions and
Changes</asp:label><asp:button id=Button4 style="Z-INDEX: 106; LEFT:
488px; POSITION: absolute; TOP: 248px" runat="server" Width="200px"
ForeColor="CornflowerBlue" Font-Bold="True" Text="Transfer Travel
Dollars" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button6
style="Z-INDEX: 107; LEFT: 488px; POSITION: absolute; TOP: 280px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Spend Travel Dollars" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button7
style="Z-INDEX: 108; LEFT: 488px; POSITION: absolute; TOP: 312px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Create a New Event" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button8
style="Z-INDEX: 109; LEFT: 488px; POSITION: absolute; TOP: 344px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Edit or Delete an Event" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button9
style="Z-INDEX: 110; LEFT: 488px; POSITION: absolute; TOP: 376px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Change Products" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button10
style="Z-INDEX: 111; LEFT: 80px; POSITION: absolute; TOP: 312px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="Review Products" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:button id=Button11
style="Z-INDEX: 112; LEFT: 488px; POSITION: absolute; TOP: 408px"
runat="server" Width="200px" ForeColor="CornflowerBlue"
Font-Bold="True" Text="End of Month Processing" BorderStyle="Solid"
BackColor="AliceBlue"></asp:button><asp:label id=Label4 style="Z-INDEX:
113; LEFT: 576px; POSITION: absolute; TOP: 8px" runat="server"
Width="152px" Font-Italic="True" ForeColor="CornflowerBlue"
Font-Bold="True">You are logged in as:</asp:label><asp:label id=Label6
style="Z-INDEX: 114; LEFT: 584px; POSITION: absolute; TOP: 32px"
runat="server" Width="224px" Font-Italic="True" Font-Size="Large"
ForeColor="CornflowerBlue" Font-Bold="True"></asp:label><asp:Label
id=Label2 style="Z-INDEX: 115; LEFT: 368px; POSITION: absolute; TOP:
312px" runat="server" Width="96px" Font-Size="Larger" ForeColor="Red"
Font-Bold="True" Font-Names="Agency FB">Try this
one---></asp:Label><asp:Label id=Label3 style="Z-INDEX: 116; LEFT:
296px; POSITION: absolute; TOP: 248px" runat="server" Width="96px"
Font-Bold="True" ForeColor="Red" Font-Size="Larger" Font-Names="Agency
FB"><---Try this one</asp:Label>
</form>

</body>
</HTML>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Back
Top