Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Sep 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Script to change div styles not working, not defined error

    I have a form where I want certain fields to be visible only if the user clicks a checkbox on the form.

    Specifically, when Presented_to_Goverment_EntityCheckbox0 is checked, these fields should appear.

    Code:
    DropDownList ID="GovEntity"
    	Officials_Last_NameTextBox0
    	Officials_First_NameTextBox0
    	Officials_TitleTextBox0
    I created two different styles, show below; one makes the fields visible and one hides them
    Code:
    	<style type="text/css">
    	.hideit {
    	visibility: hidden;
    	overflow: hidden;
    	position: absolute;
    	}
    	.showit {
    	visibility: visible;
    	overflow: visible;
    	position: static;
    }
    
    
    	</style>

    Then I surrounded the fields with a div ID'ed as wdiv

    Code:
    <div class="hideit" id="wdiv">
                                            Type Government Entity:
                                            <asp:TextBox ID="Type_Government_EntityTextBox" 
    
    runat="server" 
                                                Text='<%# Bind("Type_Government_Entity") %>' />
                                            <br />
                                            Officials Last Name:
                                            <asp:TextBox ID="Officials_Last_NameTextBox" 
    
    runat="server" style="display:none"
                                                Text='<%# Bind("Officials_Last_Name") %>' />
                                            <br />
                                            Officials_First_Name:
                                            <asp:TextBox ID="Officials_First_NameTextBox" 
    
    runat="server" 
                                                Text='<%# Bind("Officials_First_Name") %>' />
                                            <br />
                                            Officials_Title:
                                            <asp:TextBox ID="Officials_TitleTextBox" 
    
    runat="server" 
                                                Text='<%# Bind("Officials_Title") %>' />
                                            <br />
                                            </div>
    I am using the following javascript to change the styles in response to an onclick event.

    Code:
    <script language="javascript" type="text/javascript">
                   
    
    function changeDiv(wdiv) {	thediv = document.getElementById(wdiv);	
    
    if(thediv.className == 'hideit'){		
    
    thediv.className = 'showit';	} else if (thediv.className == 'showit'){		
    
    thediv.className = 'showit';		}}
    </script>


    I call the Javascript in this line

    Code:
     <asp:CheckBox ID="Presented_to_Goverment_EntityCheckBox" onClick="ChangeDiv(wdiv)" 
    
    runat="server" />                                
                                            <br />
    However nothing happens when I click the checkbox and if I look in Firefox's error console it says ChangeDiv is not defined. Thanks.

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Code:
    onClick="ChangeDiv(wdiv)"
    You should pass the id as a string, not as a variable. And use lowercase for the handlers in order to avoid any problems regarding the Doctype rules.
    Code:
    onclick="ChangeDiv('wdiv')"
    Last edited by Kor; 09-02-2009 at 08:33 PM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    New to the CF scene
    Join Date
    Sep 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It worked! A thousand thank yous!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •