[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2780
  • Last Modified:

Jquery radiobutton show hide div question

Hi there, i have two radio buttons that should show/hide two divs, I am using jquery here is my code, as far as i can tell both divs are hidden on load but the checkbox does not show them. using the latest jquery.
<script type="text/javascript">
    $(document).ready(function(){
	$("#hourlydiv, #fixedfee").hide();
    
	if($("input[name='type']:checked").val() =="hourly") {
            $("#hourlydiv").show("fast");
            $("#fixedfeediv").hide("fast");
	} else if ($("input[name='type']:checked").val() =="fixed") {
            $("#hourlydiv").hide("fast");
            $("#fixedfeediv").Show("fast");
	}
});
 
     </script>

Open in new window

0
cookiejest
Asked:
cookiejest
2 Solutions
 
strickddCommented:
you need to create an onclick function that will show/hide the div's, the ready function will only be called when the page is done loading.
0
 
SadafRasheedCommented:
try this
<script type="text/javascript">
    $(document).ready(function(){
        $("#hourlydiv, #fixedfee").hide();
    
		$("input[name='type']").click(function (){
		
			if($("input[name='type']:checked").val() == "hourly" ) {
				$("#hourlydiv").show("fast");
				$("#fixedfeediv").hide("fast");
			} else if ($("input[name='type']:checked").val() =="fixed") {
				$("#hourlydiv").hide("fast");
				$("#fixedfeediv").Show("fast");
			}
		});
		
        
});
 
</script>

Open in new window

0

Featured Post

Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

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