• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 575
  • Last Modified:

Set a label to visible when a particular DetailsView field has focus.

I have a page containg a DetailsView and a label.  I need to figure out a way to make different labels visable depending on which DetailsView field has focus.  The goal is to give detailed instruction on each field as the are selected for entry.  
  • 3
1 Solution
Answer for C#:

YouTextFieldName.Visible = true;
or YouTextFieldName.Visible = false;
bchadezAuthor Commented:
By default I want to set Label1.Visible=false.  Then when I place the cursor in lets say the Inc_StreeAddress textbox field of my DetailsView, Label1 will become visible.  If I move the cursor to the next field, lets say Inc_City, then I want Lable1 to no longer be visable and a new label to become visable and so on for each textbox.
bchadezAuthor Commented:
Ok I have figured it out.

I placed a script manager on my .aspx page:
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" >

I created a javascript file "JScript.js" with the following code to control the visibility of my lables:
//Street Label
function dispStreetLbl() {
    document.getElementById('StreetLbl').style.display = 'block';
function hideStreetLbl() {
    document.getElementById('StreetLbl').style.display = 'none';

//City Label
function dispCityLbl() {
    document.getElementById('CityLbl').style.display = 'block';
function hideCityLbl() {
    document.getElementById('CityLbl').style.display = 'none';

//State Label
function dispStateLbl() {
    document.getElementById('StateLbl').style.display = 'block';
function hideStateLbl() {
    document.getElementById('StateLbl').style.display = 'none';

//Zip Label
function dispZipLbl() {
    document.getElementById('ZipLbl').style.display = 'block';
function hideZipLbl() {
    document.getElementById('ZipLbl').style.display = 'none';

I referenced the javascript file on my .aspx page:
<script src="JScript.js" type="text/javascript"></script>

I placed a script on my .aspx page above the <head> to capture the textboxs inside the DetailsView and fire off functions in my javascript file:
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
        //Street TextBox
        TextBox Street = (TextBox) DetailsView2.FindControl("Street");
        Street.Attributes.Add("onfocus", "dispStreetLbl();");
        Street.Attributes.Add("onblur", "hideStreetLbl();");

        //City TextBox
        TextBox City = (TextBox)DetailsView2.FindControl("City");
        City.Attributes.Add("onfocus", "dispCityLbl();");
        City.Attributes.Add("onblur", "hideCityLbl();");

        //State TextBox
        TextBox State = (TextBox)DetailsView2.FindControl("State");
        State.Attributes.Add("onfocus", "dispStateLbl();");
        State.Attributes.Add("onblur", "hideStateLbl();");

        //Zip TextBox
        TextBox Zip = (TextBox)DetailsView2.FindControl("Zip");
        Zip.Attributes.Add("onfocus", "dispZipLbl();");
        Zip.Attributes.Add("onblur", "hideZipLbl();");
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat='server'>

bchadezAuthor Commented:
One more thing I forgot.

Created lables with style="display: none;":

                    <asp:Label ID="StreetLbl" runat="server"
                        Text="Enter the street."
                        style="display: none;" Height="200px" Width="300px"></asp:Label>      
                    <asp:Label ID="CityLbl" runat="server"
                        Text="Enter the city."
                        style="display: none;" Height="200px" Width="300px"></asp:Label>      
                    <asp:Label ID="StateLbl" runat="server"
                        Text="Enter the state."
                        style="display: none;" Height="200px" Width="300px"></asp:Label>  
                     <asp:Label ID="ZipLbl" runat="server"
                        Text="Enter the zip code."
                        style="display: none;" Height="200px" Width="300px"></asp:Label>      

Featured Post

Technology Partners: 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!

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now