Show/hide Div Based On Radio Button Select

Jul 12, 2007

i would like to have 2 radio buttons each with a associated div when the page loads the first radio button will be checked and its corresponding div will be show when the user checks the other radio button its corresponding div is shown and the first div is hidden:

ADVERTISEMENT

JQuery :: Hide/Show Based On Radio Button Selected?

Sep 14, 2009

I am trying to create a script that will display content based on if aradio button is selected, and if the other is selected would hide thecontent. Now, each of these radio buttons are part of a radio group,so their names are the same. Most examples show nput:radio[@name=item] Since I have 2 items that have the same name, I can't usename, so I thought I would try id or value. It isn't working. If I addonly the show, whenever you select either radio button, it shows, andif I add the hide code, it doesn't work at allHere is what I have right now.

$(document).ready(function(){
$('#offices_checkboxes').hide();
$("input:radio[@value=1]").click(function() {

[code]....

View 2 Replies View Related

JQuery :: Show/hide Form Elements Based On Radio Button Selections ?

Mar 17, 2011

I have a set of radio buttons on my pricing page:

And a corresponding text_field input element div I'd like to display based on which radio button the user selects:

When the page loads, I'd like to see:

When the user clicks on a (different) radio button, or clicks one for the first time, I'd like whichever div is currently showing to be hidden, and the newly selected one to be shown.

Right now I have jQuery code at the bottom of my page that looks like this:

For each of the four options.

When the page loads, the correct div is shown, and when I select a new button, the new div is shown, but the already showing one isn't hidden.

I've read some posts that suggest using change() instead of click(), but others indicate that's problematic in IE.

View 1 Replies View Related

Show/Hide Buttons Based On Radio Selection

Jul 20, 2005

I have a form with three radio options. And I have three buttons:

<input type="submit" name="mainform_action" value="Edit Data">
<input type="submit" name="mainform_action" value="View Data">
<input type="submit" name="mainform_action" value="Delete Data">

If the first radio button is selected, I only want all three buttons to be
visible to the user.

If the second radio button is selected, I only want the "Edit Data" and "View
Data" buttons to be visible.

If the third radio button is selected, I only want the "View Data" button to be
visible.

Is it possible to accomplish this in Javascript? In particular, I want to
continue using the "input type=submit" buttons without having to create my own.

View 3 Replies View Related

Show - Hide Div Based On Radio Selection - Prototype

Apr 27, 2010

I have 3 divs that contain radio with labels and beneath each radio button I would like to show/hide a form based on whether the radio is selected or not.

Code idea:

So if the radio1 input is selected this would show form1. Selecting radio2 input would hide any other forms (form1, form3) and show form 2 etc.

View 1 Replies View Related

Show / Hide Divs Based On Radio Input

Mar 25, 2010

I'm having some issues with showing / hiding divs in a form based on radio button input. I'm fairly new to JavaScript so I'm still not 100% on what I'm doing... I have a pretty extensive form with quite a few container divs that are set initially to "display: none" and I need them to be set to "display:block" dependent on radio button input.

For this piece, I need the div with id "SFSCPROJSPONCOMP" to be displayed when the user selects the Radio button with name "PROJSPON" and value "COMP".If someone could provide me with JS code for that example, I can get through the rest of this form with ease.

View 2 Replies View Related

Jquery :: Hide / Show Div Based On Radio Class?

Apr 18, 2010

what i have are 3 radio buttons at top of my form, the first radio option i would like if selected to open a div that contains new questions on the form... then if the other radio buttons are selected they hide that div.

View 1 Replies View Related

Display/Hide DIV Based On Radio Button Input?

Dec 1, 2009

I'm fairly new to Javascript and would be grateful for any help you can give me. I've had a search on Google and found a couple of potential solutions but nothing seems to work quite right for what I need.

Basically I have a form with several questions followed by Yes/No radio buttons. Dependent on which answer is given, I want to display a different message above the text box.

For example, if you answered 'no' to a certain question then the message above the text box would change to say "Please fill in additional information" or something along those lines.

[Code]...

View 3 Replies View Related

Show - Hide Div Based On Select Box Choice

Jun 22, 2011

I have a select box where the value must be passed via the form. If the users selects choice B or Choice C then I want a specific div to show. If they choose choice A then I want the div to hide or remain hidden. It should be hidden on page load.

Code:

View 1 Replies View Related

Show/Hide Div Based On Select Box Choice?

Jun 22, 2011

Ok so I have a select box where the value must be passed via the form. If the users selects choice B or Choice C then I want a specific div to show. If they choose choice A then I want the div to hide or remain hidden. It should be hidden on page load.

<select name="Event_Type_ID">
<option value="1">Choice A</option>
<option value="2">Choice B</option>

[code]....

View 2 Replies View Related

Show And Hide Radio Button?

Sep 17, 2010

I have to 2 radio buttons and two hidden divs. How would I be able to show and hide them depending on the selection I've chosen?

View 4 Replies View Related

Hide/Show Text Field On Radio Select

Aug 10, 2006

I'm a *real* JS noob and need to show or hide a text field when a radio is selected. This is what I've tried so far. Code:

View 3 Replies View Related

Very Basic Show/hide Div With Radio Button?

Apr 2, 2009

i have made this request as simple as possible.When my page loads I would like div1 and div2 to both be hidden

If user clicks Div 1 radio then
div1 = visible
div2 = hidden

[code].....

View 3 Replies View Related

Show/hide Multiple <tr> Based On <select OnChange="?

Jul 24, 2011

Show/hide table rows via select menu choices - And I changed my Javascript up a little so that I would have an easier time remembering it.Here are the codes:

HTML

<table cellspacing="5" cellpadding="5" border="0">
<tr>
<td><strong>Request Service:</strong></td>
<td><input type="radio" value="Website Design" />

[code]....

View 4 Replies View Related

JQuery :: Show/hide On Radio Button Click

Aug 4, 2009

I'm trying to do a show/hide on a radio button click and I do have it working, but I'd like to make it more...extensible/independent of hard- coding children elements to show hide.

My dummy html structure is:

I left some commented out stuff at the top of the function, hopefully to give you an idea of what I tried.

In particular:

I was trying to get the first ul (the children to show/hide) on "this" (the radio button clicked). I'd like this to be flexible to where you could add more radio button/children and as long as the structure stays the same, the show/hide functionality works.

View 2 Replies View Related

JQuery :: Show Or Hide A Single Section Of A Form Based On The Value Of A Select Box?

Aug 2, 2011

Using jQuery, the hide show part is easy. I need to show or hide a single section of a form based on the value of a select box. More specifically, if the select box is one of 30 countries, then show, else hide.

What's the easiest way to handle this?

View 4 Replies View Related

JQuery :: Show / Hide A <div> When Changing The Selection Of A Radio Button?

Mar 2, 2010

I want that a <div> element will show when yes is selected and when no it should be hidden. For show and hind i will use the functions from the jQuery UI. But I don't find a way to call the hide / show function when the selection change.

The radio selection: <input type="radio" name="lang_anz" value="1"> Yes<br> <input type="radio" name="lang_anz" value="0" checked="checked"> No<br> When I understand the documentation I can request the current value from the radio with: <script type="javascript"> $('input:radio[name=lang_anz]:checked').val(); </script>But how i can now call the show / hide function when I change the selection?

View 1 Replies View Related

Show / Hide Form Fields Depending On Radio Button Selection

May 29, 2005

How to show and hide form fields depending on a selected radio button.

View 14 Replies View Related

Show / Hide Div Layer / Change Link Color / When Radio Button Is Selected

Aug 16, 2010

I am trying to develop an exam system.Find my code below.I request you to copy the code and save it as an html file .I have 2 problems:

1. Kindly notice that when the quiz is loaded,it shows both the questions by default.I want only question 1 to be visible when the quiz loads.What happens presently is that ,both questions are visible even after I click on the link
Q.1( referring to question 1).However,when I click on
Q. 2,then only question 2 can be seen and then(after clicking on Q.2) if I click on Q.1,then only question 1 can be seen

What I want is that when the page loads only question 1 is visible.Then when I click on Q.2,I can see only question 2 and when I click on Q.1, I can see only question 1.I later plan on adding many questions,so it should be a general solution rather than a solution good only for 2 questions.

2.Also,what I want is that,if someone selects any of the answers of a particular question,it's link color should turn green to indicate to the user that he answered that question.So for,instance,if I select an answer to the first question(select one of London,New York,Seattle,Washington,Chicago), the link Q.1 should turn green.

View 3 Replies View Related

JQuery :: Show / Hide Elements Or Remove / Add Elements Based On Radio Selection By User?

Mar 14, 2010

I have a page I am working and I am having some trouble with: I need to show and hide areas based on a radio selection. I initally started using the show / hide feature in Jquery but the problem is the elements need to be removed but then put back if the user selects the radio buttonagain as it has form elements that have validaion on them. The validation is still trying to validate the form elements becuase they are still on the page but just not showing. This is the radio group the user makes the selection from:

<input name="terms_usr" type="radio" id="terms_usr_1" value="1"/>
<label for="terms_usr_1">Credit Card</label>
<input type="radio" name="terms_usr" id="terms_usr_2" value="2"/>
<label for="terms_usr_2">C.O.D</label>

[Code]....

View 3 Replies View Related

JQuery :: Pass Radio Button Selection To Hidden Div And Then Show Div List From Chosen Radio Button?

Mar 16, 2010

I am a PHP programmer and new to Javascript and jQuery and I have tried about 20 examples/tutorials and cannot seem to get even close to what I want.I have a form (PHP/MySQL) with a list of subjects I got from my database, and then create a set of radio buttons from that list. And based on what radio button they select, I need to pass that variable to a div (at least that's what I want to use) and then show a list of videos that match the radio buttons value. I don't care if its a get or post or other.I tried to use GET or POST so I can use that value for my PHP/MySQL lists.I am open to any suggestions/tutorials, etc.

View 1 Replies View Related

JQuery :: Toggle Function - Hide/show Table When Hide/show Button Is Pressed

Sep 12, 2011

I am trying to hide/show table when hide/show button is pressed

Problem: The code works fine when I remove 'slow' from line 10. But with 'slow' in line 10 content of toggleButton doesnt change from Hide to Show when pressed.

Code:

View 1 Replies View Related

JQuery :: (.) Period In Value Field - Show/hide A Div Based Based On The Selection Made Via A Dropdown

Apr 9, 2010

Im using a jQuery script to show/hide a div based based on the selection made via a dropdown.

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

The problem im having is that the value used in the dropdown lists are price values eg 10.00

Consequently jQuery seems to interprit these as css notations, meaning the code doesnt work.

View 4 Replies View Related

When The User Select One Radio Button The Other Radio Buttons Should Disable?

Oct 21, 2011

I have a form with 4 radio buttons, the scenario is, when a user click on a radio button a hidden content will be displayed and the other three radio buttons will be disabled so that at one time a user can only click and view single radio button and the hidden content.Here is my code to show hide the hidden content but i need when the user select one radio button the other radio buttons should disable.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />[code]......

View 17 Replies View Related

Show / Hide A Div When A Radio Is / Isn't Selected

Oct 16, 2009

I am new to this kind of scripting, so I have not done it before, I have tried to find solutions on the net but none have worked. I have a 'contact us' form, which includes 2 radio buttons to select how they wish to recieve their reply... the first radio is 'email' the second radio is 'phone' When the 'phone' radio is selected, i want the div including a drop downbox to appear to ask what time to recieve a call, but when the 'email' radio is selected, this div does not appear. This is the script for this section.

[Code]...

View 2 Replies View Related

ADVERTISEMENT