Latest Tutorials| Questions and Answers|Ask Questions?|Site Map



Home Answers Viewqa JSP-Interview-Questions Help with jQuery show hide div script

Have Programming Question? Ask it here!
 
 
 


Jason
Help with jQuery show hide div script
0 Answer(s)      3 years and 10 months ago
Posted in : JSP-Interview Questions


Hi guys,

I have a jquery script for showing and hiding the content inside, between two divs, controlled with radiobuttons. I like to use the same jquery script for another group of divs and radiobuttons so I'm trying to create a loop are so inside jQuery.
Could somebody please help. Thx in advance.

<!----------------- my script ---------------------->

showhide.js

jQuery(function() {

$(document).ready(function(){
$("#div1").css("display","none"); // ol id
$('#div1 :input').attr('disabled', true);
$("#div2").css("display","none"); // ol id
$('#div2 :input').attr('disabled', true);



$(".controledivs").click(function(){
if ($('input[name=radiobtngroup1]:checked').val() == "1" ) {
$("#div1").slideDown("fast"); //Slide Down Effect
$('#div1 :input').removeAttr('disabled');
} else {
$("#div1").slideUp("fast"); //Slide Up Effect
$('#div1 :input').attr('disabled', true);
}

if ($('input[name=radiobtngroup1]:checked').val() == "2" ) {
$("#div2").slideDown("fast"); //Slide Down Effect
$('#div2 :input').removeAttr('disabled');
} else {
$("#div2").slideUp("fast"); //Slide Up Effect
$('#div2 :input').attr('disabled', true);
}

});
});

});

<!------------------- html --------------------------------->


<input name="radiobtngroup1" class="controledivs" type="radio" value="1" />
<input name="radiobtngroup1" class="controledivs" type="radio" value="2" />

<div id="div1">

content

</div>

<div id="div2">

content

</div>




<!------- What can I do to use the same above jQuery for the html below ----------------->


<input name="radiobtngroup2" class="controledivs" type="radio" value="3" />
<input name="radiobtngroup2" class="controledivs" type="radio" value="4" />

<div id="div3">

content

</div>

<div id="div4">

content

</div>

Advertisement
View Answers

Related Tutorials/Questions & Answers:
Help with jQuery show hide div script - JSP-Interview Questions
Help with jQuery show hide div script  Hi guys, I have a jquery script for showing and hiding the content inside, between two divs, controlled with radiobuttons. I like to use the same jquery script for another group of divs
Jquery Hide and Show Div
: Show/Hide Div in jQuery <!DOCTYPE html> <html> <head> <...Using jQuery effects one can perform lots of task such as Hide, Show, Toggle... and Hide methods in Java. .show() in jQuery is used to display the matched elements
Advertisements
jQuery To Hide the Div
jQuery To Hide the Div       In this JQuery tutorial we will develop a program that Hide of a Div Steps to develop the Hide of a Div . Step 1:       Create a new file
JavaScript Hide Div
JavaScript Hide Div...; In this section, we are going to hide div element on clicking the button using... the text invisible. Here is the code: <html> <h2>Hide Div
Hide/Show paragraph by button click
Hide/Show paragraph by button click In this tutorial, we will discuss about how to hide/show paragraph by clicking on button using jQuery. In the below... to show Paragraph</button> <p>This will Hide after clicking button<
hide show keyboard iphone
hide show keyboard iphone  How to hide show keyboard in iPhone programmatically
hide show keyboard iphone
hide show keyboard iphone  How to hide show keyboard in iPhone programmatically
hide show keyboard iphone
hide show keyboard iphone  How to hide show keyboard in iPhone programmatically
JavaScript Show Hide table
JavaScript Show Hide table...; In this section, we are going to show and hide table on clicking the button using...;h2>Show or Hide table in JavaScript</h2> <script>
Show Hide Text Javascript - Java Beginners
Show Hide Text Javascript  Please tell me how to show hide text using Java Script
remove and add div jquery
remove and add div jquery  I want to enable my users to remove or add DIV using JQuery.   $('.add_more').click(function(){ var description = $('#description').val(); $newEl = $('<div class="description_text
hide and show result in jsp
hide and show result in jsp  what codes do i have to change to make... or after my while statement in search.jsp file. please help. thank you so much..., MEMBER M WHERE M.MEMBER_ID= B.MEMBER_ID"); } %> <script language="javascript
Hide boxes by clicking on it using jQuery
Hide boxes by clicking on it using jQuery In this tutorial , we will discuss about how to hide boxes by clicking on it using jQuery. In the given below.... These hide action is due to event click. jqHideboxonclick.html  
Hide hyperlink using jQuery
Hide hyperlink using jQuery In this tutorial, we will discuss about how to hide hyperlink after clicking it using jQuery. In the below example , a hyperlink "Click here to hide this link" is included in the web page. When we
Hide show HTML forms using javascript
Hide show HTML forms using javascript  How to hide a HTML form in my application using JavaScript?   HTML Code to create checkbox <...;div id="yourDiv"> ...other forms... </div> JavaScript function to hide
jQuery Toggle the Div
jQuery Toggle the Div       In this JQuery tutorial we will develop a program that toggle the content...: The following code includes the jQuery JavaScript library file: <script type
Show mu;tiple DIV contents in a page
Show mu;tiple DIV contents in a page  Hi All; I want to show... drop down list THE DIV content that was previously displayed will hide... CAN.... on selecting an option, it should display 1 div out of 3 div contents. 1st div tag
Show text by button click using jQuery
Show text by button click using jQuery In this tutorial, we will discuss about hide/show text by clicking on button. In the below example, there are two buttons : hide and show .The "hide " button is used to hide text
Hide/show Image by click
Hide/show Image by click In this tutorial ,we will discuss about how to display image by click using jQuery. In the below example, a image and two lines...; Click here to hide the logo </font> </div> <div id
qunit jquery with java script
qunit jquery with java script  hi deepak How to write a javascript code and do the test by using qunit sample application and as I am new to testing how to setup the environment for java script testing? where should I run
Show Limited Data Using jquery
Show Limited Data Using jquery  How to show limited results in JQuery... it using JQuery?   See the JQuery example to show the limited fetch results in JQuery. var comments = $('.description_text').size(); if (comments >
show, hide, disable components on a page with struts - Struts
show, hide, disable components on a page with struts  disabling a textbox in struts.. in HTML its like disable="true/false" how can we do it in struts
Browser Back Button Disable/Hide/Invisible using Java Script
Browser Back Button Disable/Hide/Invisible using Java Script  Dear Sir, Please Help..., Q: How to Write Code For Browser Back Button Disable/Hide/Invisible using Java Script without Page Reload/Refreshing. anyone
Toggle hide/show by clicking same button
Toggle hide/show by clicking same button In this tutorial, we will discuss about how to toggle hide/show by clicking button. In the given below 2 example, there is button ,by clicking on it, the paragraph will hide/show . In first
Animate Div in Jquery
There are several jQuery methods that can be used for different purpose like jQuery .finish(), .queue(), .show(), .slideDown(), .slideUp(), .stop... in jQuery. Animate Div in jQuery - jQuery .animate() Example  In jQuery
JSP hide and show tables
JSP hide and show tables In this tutorial, you will learn how to hide and show html tables using javascript in jsp. Here is an example of simple jsp code which is having a table consists of database data and a Go button. Using
how can i hide and show tables
how can i hide and show tables  hai, i am creating a form which the code is included below i want to hide the tables initially and after i click go i want to display the tables with result.so any help is appreciated much <
jQuery to Show Data Randomly
jQuery to Show Data Randomly      ...;head> <title>AJAX with jQuery Example</title> <script type...; <div id="wrapper"> <script type="text/javascript"
Dojo Show and Hide Dialog
Dojo Show and Hide Dialog         In this example, you will learn dojo show and hide... box. Try Online: Show and Hide Dialog Here is the code: <
Java Script Help
help --- <html> <head> </head> <script language...Java Script Help  I have written a countdown timer using javascript....' window.location = 'crdtd.php?q=b
Need Help on the script
Need Help on the script  hello there, My name is Femi and am a web developer using php. am working on a project. and am having some difficulties. i dont know if you can help me out with it. The platform am building will receive
How to hide and show some field on a radio button click
How to hide and show some field on a radio button click  This is my code part:- PAYMENT DETAILS <table cellpadding="0" cellspacing="0" align...; document.getElementById(bankname).style.display=none; } } please help me
jQuery - jQuery Tutorials and examples
;.    jQuery To Hide the Div In this JQuery tutorial we will develop a program that Hide of a Div    jQuery... will show you how to use jQuery to develop nice ajax based applications
jQuery Demos
jQuery Hide/Show paragraph by button click... jQuery to validate Email Address jQuery To Hide the Div... Hide hyperlink using jQuery Hide text
jQuery tutorial for beginners
jQuery tutorial for beginners Learn jQuery with the help of our tutorial....js"></script> Step 3: Adding jQuery code to show alert message... jQuery in detail with the help of our free jQuery tutorials at http
Show text field & check input using jQuery
Show text field & check input using jQuery In this tutorial, we... input using jQuery. In the below example, aIn this tutorial, we will discuss about... jQuery. In the below example, a button is given when we click on it, 
Hide text by clicking button
Hide text by clicking button In this tutorial, we will discuss about hide/show... : hide and show .The "hide " button is used to hide text and "show button " is used to show text. These actions are fired when "
JQuery
JQuery  hi there, I am just beginner for jQuery and i want to know-what is jQuery ? How it is better than JavaScript ?   jQuery... JavaScript : Each jQuery returns itself so you can chain them together(Chaining
jQuery with other libraries
;jQuery Example</title> <script type="text/javascript" src="... jQuery jquery with other Libraries      There are many JavaScript libraries to help
jQuery Tutorials, jQuery Tutorial
jQuery Tutorials, jQuery Tutorial The jQuery tutorials listed here will help you in learning jQuery easily. We have given many articles and easy... to create neat and clean project with the help of jQuery Write unit
jquery
jquery  What are the Jquery similarities or difference with other java script libraries
JavaScript hide image
; In this section, we are going to show and hide image on clicking the button using... and Hide Image in JavaScript</h2> <script language=javascript type... JavaScript hide image
JavaScript hide() method
JavaScript hide() method       JavaScript provides a method hide(), so that user can hide elements whenever they require. This function may be helpful when user wants to show some
Moving Div by button click using animate effect
Moving Div by button click using animate effect In this tutorial , we will discuss how to move 'div' left-right by button click using jQuery. In this example , 'div' is moving left / right by left / right button click
jQuery autocomplete
with the help of jquery plugin and php/mysql . In this example when we press the name...=utf-8" /> <title>jQuery Auto Complete</title> <script...jQuery Autocomplete : Autocomplete is a common feature available in lot of web
javascript hide element
javascript hide element  How can we hide / show HTML elements using JavaScript
Animating 'Div' blocks with different effects simultaneously
Animating 'Div' blocks with different effects simultaneously In this tutorial, we will discuss about how to animate 'Div' blocks with different effects simultaneously using jQuery. In this Example, we have two Div
autocomplete(): Spring mvc with jquery: I am not getting correct value in the text filed. Please help me
autocomplete(): Spring mvc with jquery: I am not getting correct value in the text filed. Please help me   Hi have develop the jsp to populate...;jQuery UI Autocomplete - Multiple, remote</title> <link rel="stylesheet
JQuery
JQuery  how to use jquery
jQuery Tutorial
jQuery Tutorial jQuery is a cross browser, java Script library created by ... and the each function. JavaScript Plug-ins jQuery is java script and can... more". It handles the client side scripting of HTML. jQuery simplifies 
 

 

 

DMCA.com