JQuery :: Show Hide Multiple Other HTML Input Fields

Mar 1, 2010

I am having some jQuery troubles whereby I have some jQuery that toggles an 'Other' HTML input field and associated label when a user selects the value Other from a HTML select drop down. I have this working for one field but the application I am building has increased in scope whereby there may be multiple instances of members on one page so the Other option will be there multiple times. At the moment if a user selects Other from one drop down all Other input fields show. How do I make this exclusive without repeating the jQuery for the separate instances?

// Show/Hide 'Other'
$(document).ready(function() {
$('.jOther').hide();
$('.jTitle').change(function() {
var $index = $('.jTitle').index(this);
alert($index);
if($('.jTitle').val() != 'Other') {
$('.jOther').hide();
} else {
$('.jOther').show();
window.location.hash = 'Other' + $index;
}});
});
<td>
<select id="title" class="inlineSpace jTitle">
<option value="Please select">Please select...</option>
<option value="Mr">Mr</option>
<option value="Mrs">Mrs</option>
<option value="Ms">Ms</option>
<option value="Miss">Miss</option>
<option value="Dr">Dr</option>
<option value="Other">Other</option>
</select>
<label for="other" class="inlineSpace jOther">Other</label>
<input type="text" class="text jOther" name="other" id="other" maxlength="6" />
</td>

View 1 Replies


ADVERTISEMENT

JQuery :: Simple Hide And Show - Dynamic Input Fields

Jul 29, 2009

For example I have this sort code:
for ($i=0;$i<$db;$i++) {
$t1="toggleh$i";
echo "<div class='c'>Test<input name='$t1' type='image' id='$t1' src='test.png'/></div> <br>";
}
I try to make clear the screen for users, so I use hide & show to hide some row on screen what users actually don't need...

The JS part of code is something like this:
$('#toggleh0').click( function() {
$('div.showhide').toggle(400);
});
$('#toggleh1').click( function() {
$('div.showhide').toggle(400);
});
$('#toggleh3').click( function() {
$('div.showhide').toggle(400);
});
.
.
.
I dont know how can do this dynamic. So if "$i=6;" then I need toggle 0-6 function...

View 12 Replies View Related

Show - Hide Dropdown - Script To Work In Multiple Select Fields?

Jun 26, 2009

I am using the following script on one of my pages (script comes from [url]:

Code:

The script works great, BUT I need to use it in 2 different areas of the same form. It only works on an id="selectMenu" and of course I cannot have more that 1 id.

How can I get this script to work in multiple select fields? (at least more than 1)

View 4 Replies View Related

JQuery :: Multiple Image Buttons To Show / Hide Multiple Elements

Sep 27, 2010

I am using jquery with the cookie plugin and I have multiple image buttons that can hide/show multiple elements. My question is how can I add a cookie to this code to remember whether each separate element is opened or closed?

The code,
$(document).ready(function() {
// choose text for the show/hide link - can contain HTML (e.g. an image)
var showText='<div class="expanddown"></div>';
var hideText='<div class="expandup"></div>';
// initialise the visibility check
var is_visible = false;
// append show/hide links to the element directly preceding the element with a class of "toggle"
$('.toggle').prev().append('<a href="#" class="togglelink">'+hideText+'</a>');
// capture clicks on the toggle links
$('a.togglelink').click(function() {
// switch visibility
is_visible = !is_visible;
// change the link depending on whether the element is shown or hidden
$(this).html( (!is_visible) ? hideText : showText);
// toggle the display - uncomment the next line for a basic "accordion" style
//$('.toggle').hide();$('a.toggleLink').html(showText);
$(this).parent().next('.toggle').slideToggle('fast');
// return false so any link destination is not followed
return false;
});
});
HTML,
<a class="togglelink" href="#"></a>
<div class="toggle">
Content
</div>

View 6 Replies View Related

JQuery :: For Statement To Show / Hide Fields

May 4, 2011

I'm trying to use jquery to hide some contents in a for statement but is not working. Here is the code

if( $total_attachments > 0 ) {
for ($i=0; $i < $total_attachments; $i++) {
//output div and image in it
echo '<div class="pictures_entry">';
echo '<a href="'.$attachments[$i]["location"].'" title="'.$attachments[$i]["title"].'" rel="prettyPhoto[gallery]"><img src="'.$attachments[$i]["location"].'" width="128" height="120" alt="'.get_the_title().'" /></a>';
echo '<div id="pictures_entry_name_'.$i.'">';
echo '<h6>'.$attachments[$i]["title"].'</h6></div>';
echo '</div>';
}}?>

I want to hide the pictures_entry_name_'.$i. and when a user clicks on a picture <a href="'.$attachments[$i]["location"].'" title="'.$attachments[$i]["title"].'" rel="prettyPhoto[gallery]"><img src="'.$attachments[$i]["location"].'" width="128" height="120" alt="'.get_the_title().'" /></a>,
I want to slide down the pictures_entry_name_'.$i of this picture.

View 5 Replies View Related

JQuery :: Design A Webpage With Multiple Input Fields To Use The Keypad?

Mar 17, 2011

I am trying to design a web page with multiple input fields to use the keypad, but I also want the prompt to change with each field

View 1 Replies View Related

Show And Hide Form Fields?

Mar 23, 2011

I have a drop down selection where it shows and hides form inputs depending on selection. When the page loads it shows the drop down selections with no form inputs. After user selects drop down it shows the form fields. It works great but I want it to show the same form fields after the user hits the submit button which submits the page to itself. It currenlty goes back to the default selection list and doesnt show any of the form fields. Basically it hides all the form fields after the user hits submit button. How do I make it keep the last shown form fields after the user hits the submit button?

test3.html looks like this:
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Show/Hide</title>
<script type="text/javascript">

[Code]...

View 17 Replies View Related

JQuery :: Ways To Hanlde Multiple Dynamic Input Fields In Form?

Mar 1, 2011

I have a set of input fields that can be dynamically duplicated/cloned or removed and submitted. I'm looking for a ways to configure the form for easy processing without having to loop through each input field inside the divs:

<form action="dummy.php" method="post">
<div id="customer1">
Name: <input type="text" name="name1">

[code]....

View 2 Replies View Related

JQuery :: Add Show And Hide Behaviour To Multiple Classes

Nov 9, 2010

adding my show and hide behavior across various classes, so the message shown will be unique to the class.

My J-Query looks like this;

<script type="text/javascript">
$(document).ready(function() {
$('#One').hide(); /
$('.col2').hover(

[Code]....

I have include a demo that should make it clearer, as to what I want to achieve. Ideally, each box will show a unique overlayed message as the user's mouse enters the box and hide once the mouse leaves.

View 2 Replies View Related

JQuery :: Show/Hide Of Multiple Items At A Time With UL / LI / DL?

Dec 15, 2011

I have a UL group with multiple LI items, and each LI has a DL with a DT and DD inside. What I am trying to do is show EACH LI's DT, but not the DD. The DD will only show once the DT has been clicked (except for the first, which should be visible on page load.here is the structure code ... I am struggling to make this work using jQuery show/hide functionailty.

<!-- LIST -->
<ul class="examples">
<!-- ITEM #1 -->

[code]....

View 1 Replies View Related

JQuery :: Show/Hide Divs For Multiple Selects?

Mar 25, 2011

I have a jquery function that will show or hide a div id="hide1" based on the result of a select id="ticket1"

$(document).ready(function(){
$('#hide1').hide();
$('#ticket1').change(function(){
if(this.value == 'adult'){$('#hide1').hide();}

[Code]....

It works well! But my script actually clones elements of the form so a user could be selecting adult or child for a number of tickets - ticket1,ticket2,ticket3....

How can I adapt that script so that it will show/hide for each ticket

View 4 Replies View Related

JQuery :: Show / Hide Multiple DIVs On Page?

Jul 11, 2011

I have a little issue with trying to hide / show multiple divs on my page. I am using a class name for the divs but the name is generated by a field have set in my database. So for example
<div class="General">Ttitle 1</div>
<div class="General">Ttitle 2</div>
<div class="General">Ttitle 3</div>
<!-- and my link is -->
<a href="#" class="toggle" title="General">Toggle 1</a>

And then say I have
<div class="Questions">Ttitle 1</div>
<div class="
Questions ">Ttitle 2</div>
<div class="
Questions ">Ttitle 3</div>
<!-- and my link is --><a href="#" class="toggle" title="
Questions ">Toggle 2</a>

What would be the easiest way or the best way to code out the jquery to hide / show all the divs with the same name as the links title i can do code jquery to toggle 1 div but not sure how to code it so that it will hide / show all the divs with the same class name.

View 5 Replies View Related

JQuery :: Show/hide Multiple Divs Independently?

Mar 28, 2010

Is there a way I can simplify my code below? I want to be able to have just one iteration of the code and have it automatically switch out the IDs without have to add a new bit of JavaScript with each new div that is added. Here's my Javascript:

$(document).ready(function() {
// toggles the personnel window on clicking the image/header
$('div.title'+'#one').click(function() {

[code]....

View 2 Replies View Related

JQuery :: Show Hide Multiple Divs Independently Without #ID?

Dec 5, 2009

I am new to jquery and need some help with this I have the following simplified html

[Code]...

View 2 Replies View Related

JQuery :: Show / Hide Single Div With Multiple Links

Mar 22, 2011

I am getting to know jquery a little, and I am trying hide and show a div when a link is clicked.I have a page setup that has a flash video in a div on the main page. Then when a link is clicked, a lightbox window opens and plays another video. I am trying to get the video on the main page to hide while the lightbox video is playing. Then when a user closes the lightbox window, the div with the main video on the page is shown and starts playing again.So far I can get this to work with one link. But I cannot get the main video div to hide when a second link is clicked.

View 1 Replies View Related

JQuery :: Using Show Hide Div Script For Multiple Div Groups?

Jul 3, 2010

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.

<!----------------- my script ---------------------->
showhide.js
jQuery(function() {

[code]....

View 9 Replies View Related

JQuery :: Hide / Show Multiple Divs From Anchor Tags?

May 3, 2011

I've got an issue with the attached file.

I have 3 buttons & 3 divs.

I would like to hide/show the relevant divs (into a container) based upon the button pressed. If no div was open, then it would simply open the relevant div, however if say div 2 was open and div 3 was pressed, div 2 would toggle closed then div 3 would toggle open.

I've got each individual div opening and closing, but I'm stuck at the next point (checking if a div is open/toggling etc).

View 5 Replies View Related

JQuery :: Multiple Show And Hide Using MYSQL Fetch Array?

Feb 21, 2011

[code]My problem is simply that i have say 5 columns in the database placing the jquery script in that section allows that to be on each and every post. That works fine. the problem is though only the first one works the rest do not. It simply just doesn't have any action while the first one works fine.

View 1 Replies View Related

Hide/unhide Multiple Form Fields With Checkbox?

Feb 15, 2011

I have a form with a shipping address area and a billing address area. Right now I have a checkbox that fills in the billing address information if its the same as shipping information. Instead of having that so the form isnt so long when people first look at it I would like for the billing address fields to be hidden when you first come onto the page, and only if the address's are different the person will click the check box and the billing address section will appear. I know this has to be done in javascript but I have never done it

View 14 Replies View Related

Show - Hide Form Fields Based On Checkbox State

Mar 4, 2010

I'm trying to get the two followup questions underneath the checkbox to show up only if someone places a check there, but for some reason the way I've got it set up now it's simply hiding the area I want to show up altogether, and the checkbox has no effect on it.

Rather than waste tons of space pasting it here, here's the pastebin: [url]

Alternatively here is the live version:[url]

I'd prefer to have the form collapse when the additional questions are hidden, though if i can get this working at all.

View 2 Replies View Related

Conditional Logic In Form Fields Hide/show Email Field?

Oct 18, 2009

For some security reasons I would like to show an email field in a form ONLY if the 4 checkbox are checked.I don't want to use server side coding so I need to use javascript.I have this code, showing an alert if the 4 checkboxes are checked:

<html>
<head><script>
var conta=0;
function ctr(quale)

[code]...

It works but I nedd to ask for an email instead of showing an alert.

View 3 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

JQuery :: Function To Duplicate Form Elements With A Little Html-code Surrounding Input Fields

Jan 28, 2011

I made this function to duplicate form elements with a little html-code surrounding the input fields. First i clone the html of the first child found (always gets rendered by php). Then, everytime the add-button is pushed, i append a cloned piece of that stored html. It's working fine except for the delete button.

It's seems that whenever a cloned html is removed, the other cloned elements aren't recognized anymore by the delete buttons (although the delete buttons are in them)

View 1 Replies View Related

JQuery :: Checkbox Checked, True Or False Hide Or Show Other Input And Clear Value?

Jul 28, 2011

Here my script :

<script>
$(document).ready(function(){
$('#test1_invalidation_comment__row').hide();
if($('#test1_invalidation_comment').val())

[Code].....

My script work each two submit can't figure why.

View 1 Replies View Related

Ajax :: Auto-Complete With Multiple Input Fields?

Sep 20, 2011

I've tried many many thing to make this autocomplete work with multiple input fields.. please , can any one tell me how to do it? the full script attached , also the html source code is here.This is the html code with javascript that I need to add another input fields on [code]

View 4 Replies View Related

Show / Hide Div Multiple Div's?

Jun 22, 2010

Let me start by saying I'm a noob to JavaScript. What I'm trying to do for my website is have a select menu that shows the number of div's that's selected. I found a JS that I could do that with, but it only toggles, not change specifically what's selected. So if you click the wrong one, it doesn't work right.

[Code]...

View 2 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved