[jQuery] Help! Problem with using show/hide with divs

[Robert Hill]

Hello,


I'm trying to create  a script that would allow me to display a div
element when the user's mouse entered a specific div, and then have
that div close when you existed that specific div There would be about
boxes in all .

My current problem is that the #showbox closes as soon as the mouse
leaves the text... I would like to tie this event to when you leave
the Div that the text is in, and not the text itself. So far I have
only been able to tie the opening and closing of the box to the small
hit area of the next. I'm still somewhat of a newb at this, and I'm
sure I'm missing something elementary. thanks so much for looking.

Here is the HTML for one box:




td
div class=shoxboxtrigger partners

 a href=# class=showboxtriggerThe California Endowment  /a

div id=showbox realtionship information/div
 /div
 /td

CSS

.partners{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #6A3090;
background-color: #EAE2EF;
margin: 10px;
padding: 15px;
}


Here is the JQuery

var clicked;


//show box
$(.showboxtrigger).mouseover(function(){

clicked= $(this).next();
$(clicked).show(slow);

   return false;
});

$(.showboxtrigger).mouseout(function(){

$(clicked).hide(fast);

   return false;
});

[jQuery] Re: formatting/defining variable values

[Robert Hill]

Thanks for looking! I posted the source above.

cheers,
-robert

[jQuery] Re: formatting/defining variable values

[Robert Hill]

Here is the html code:

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html;
charset=ISO-8859-1 /
titleForm : Carman Research/title
link href=screen.css type=text/css rel=stylesheet
media=screen,projection /
 script type=text/javascript src=jquery.js/script
 script type=text/javascript src=jquery.form.js/script
  script type=text/javascript src=jquery.batch.js/script

script type=text/javascript


  $(document).ready(



  function(){

// this jquery inplementation is based on techniques described by
Tavis Davis at http://trevordavis.net

$(#moreReferOther).hide();
$(input[name='referOther']).click(function() {
//$(input[#formSex]).change(function(){
if ( $(input[name='referOther']:checked).val() == 'Other' ) {
$(#moreReferOther).show('slow') ;
} else { $(#moreReferOther).hide('slow');

}
});

// unstable illness more
$(#hideMedical).hide();
$(input[name='unstable']).click(function() {
//$(input[#formSex]).change(function(){
if ( $(input[name='unstable']:checked).val() == 'yes' ) {
$(#hideMedical).show('slow') ;
} else { $(#hideMedical).hide('slow');

}
});
//

// cancer more
$(#hideCancer).hide();
$(input[name='cancer']).click(function() {
//$(input[#formSex]).change(function(){
if ( $(input[name='cancer']:checked).val() == 'yes' ) {
$(#hideCancer).show('slow') ;
} else { $(#hideCancer).hide('slow');

}
});

$(#hideOtherCancer).hide();
$(input[name='otherCan']).click(function() {
//$(input[#formSex]).change(function(){
if ( $(input[name='otherCan']:checked).val() == 'other' ) {
$(#hideOtherCancer).show('slow') ;
} else { $(#hideOtherCancer).hide('slow');

}
});

//


$(#formHideSex).hide();
$(input[name='sex']).click(function() {
//$(input[#formSex]).change(function(){
if ( $(input[name='sex']:checked).val() == 'female' ) {
$(#formHideSex).show('slow') ;
} else { $(#formHideSex).hide('slow');

}
});

$(#formSeizureHide).hide();
$(input[name='seizure']).click(function() {

if ( $(input[name='seizure']:checked).val() == 'yes' ) {
$(#formSeizureHide).show('slow') ;
} else { $(#formSeizureHide).hide('slow');

}
});

/*
$(#formAllergyMedHide).hide();
$(input[name='allergyMed']).click(function() {

if ( $(input[name='allergyMed']:checked).val() == 'yes' ) {
$(#formAllergyMedHide).show('slow') ;
} else { $(#formAllergyMedHide).hide('slow');

}
});

*/

 // JQuery css Styling

 $(#errorBox).addClass(red);
 $(#container).addClass(esubStyle);

  $(#formAllergyMedHide).addClass(fhideBox);
   $(#formSeizureHide).addClass(fhideBox);
$(#formHideSex).addClass(fhideBox);
$(#moreReferOther).addClass(fhideBox);
$(#hideMedical).addClass(fhideBox);
$(#hideCancer).addClass(fhideBox);
$(#hideOtherCancer).addClass(ffhideBox);

//set variables

var referTVVal = '';
var referDirectVal = '';
var referPrintVal = '';
var referNewsVal = '';
var referWebVal = '';
var referOtherMoreVal = '';
/*
$('#formHideSex').hide();

$([EMAIL PROTECTED]'sex']).change(function(){

   if ([EMAIL PROTECTED]'sex']:checked).val() == 'female') {
   $(#formHideSex).show('slow');
} else {
   $(#formHideSex).hide('slow');
}
}



*/

//$([EMAIL PROTECTED]'makechoice']:checked).val() == 0 ? $
(#HideMe).hide('slow') : $(#HideMe).show('slow');



//
$(#submit).click(function(){
$(.error).hide();



//$(input[name='sex']).next().text(gender);  -
change the value of a text









var hasError = false;
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;

var problemVal = $(#problem).val();
var ageVal = $(#age).val();
//var sexVal =  $(input[name='sex']:checked).val();
var sexVal =  
$(input[name='sex']:checked).val();
//var referVal = $(input[name='referral']:checked).val();
//var referVal = $(#referral).val() || [];


//var referVal = 
$(input[name='referral']:checked).fieldValue();

var referTVVal = $(input[name='referTV']:checked).val();
var referDirectVal = 
$(input[name='referDirect']:checked).val();
var referPrintVal = $(input[name='referPrint']:checked).val();
var referNewsVal = $(input[name='referNews']:checked).val();
var referWebVal = $(input[name='referWeb']:checked).val();
var referOtherVal = $(input[name='referOther']:checked).val();
var referOtherMoreVal = $(#referOtherMore).val();
var moreMedicalVal = $(#moreMedical).val();

//cancer vars
var cancerVal 

[jQuery] Re: formatting/defining variable values

[Robert Hill]

I'm using 1.2.2.

I see how using checked could cause a problem, but I don't want the
values if there are not checked...

On Feb 20, 9:29 pm, Hamish Campbell [EMAIL PROTECTED] wrote:
 What version of jQuery are you using? .val() should return  rather
 than undefined if you find inputs successfully.

 HOWEVER, there is another problem:

 Putting ':checked' means that if the boxes are NOT checked, jQuery
 won't find them so .val() doesn't exist for the object. Remove the
 ':checked' and try again.

 Cheers,

 Hamish

 On Feb 21, 11:32 am, Robert Hill [EMAIL PROTECTED] wrote:

  Hello

  I'm collecting a number of values from various form elements:
  textfield, radio, checkbox.

  since some of the fields aren't require on my form, when I POST their
  values they are returned as 'undefined'

  is there a way in Jquery that would allow me to set all variables that
  are undefined with a given value like N/A or even just ?

  for example, after the form is submitted, I'm using the following code
  to populate my values:
  //cancer vars
  var cancerVal = $(input[name='cancer']:checked).val();
  var cancerTypeVal = $(#cancerType).val();
  var cancerDateVal = $(#cancerDate).val();
  var chemoCanVal = $(input[name='chemoCan']:checked).val();
  var radiationCanVal = 
  $(input[name='radiationCan']:checked).val();
  var surgeryCanVal = 
  $(input[name='surgeryCan']:checked).val();
  var otherCanMoreVal = 
  $(input[name='otherCanMore']:checked).val();

  doing something like:

  var chemoCanVal =;

  before the submit does not seem to help.

  Alternately, if there is a way that I can use a function to replace
  all instances of 'undefined' with another value after the form is
  submitted, that too would work.

  thanks in advance!

  cheers,
  -robert

[jQuery] Re: formatting/defining variable values

[Robert Hill]

oh, I misunderstood what you meant the first time. .val() instead of
check should work

originally I had wanted to collect all the values into one variable
for the checkboxes, but I ran into some problems so I changed over to
making a field for each checkbox.

On Feb 20, 9:29 pm, Hamish Campbell [EMAIL PROTECTED] wrote:
 What version of jQuery are you using? .val() should return  rather
 than undefined if you find inputs successfully.

 HOWEVER, there is another problem:

 Putting ':checked' means that if the boxes are NOT checked, jQuery
 won't find them so .val() doesn't exist for the object. Remove the
 ':checked' and try again.

 Cheers,

 Hamish

 On Feb 21, 11:32 am, Robert Hill [EMAIL PROTECTED] wrote:

  Hello

  I'm collecting a number of values from various form elements:
  textfield, radio, checkbox.

  since some of the fields aren't require on my form, when I POST their
  values they are returned as 'undefined'

  is there a way in Jquery that would allow me to set all variables that
  are undefined with a given value like N/A or even just ?

  for example, after the form is submitted, I'm using the following code
  to populate my values:
  //cancer vars
  var cancerVal = $(input[name='cancer']:checked).val();
  var cancerTypeVal = $(#cancerType).val();
  var cancerDateVal = $(#cancerDate).val();
  var chemoCanVal = $(input[name='chemoCan']:checked).val();
  var radiationCanVal = 
  $(input[name='radiationCan']:checked).val();
  var surgeryCanVal = 
  $(input[name='surgeryCan']:checked).val();
  var otherCanMoreVal = 
  $(input[name='otherCanMore']:checked).val();

  doing something like:

  var chemoCanVal =;

  before the submit does not seem to help.

  Alternately, if there is a way that I can use a function to replace
  all instances of 'undefined' with another value after the form is
  submitted, that too would work.

  thanks in advance!

  cheers,
  -robert

[jQuery] formatting/defining variable values

[Robert Hill]

Hello

I'm collecting a number of values from various form elements:
textfield, radio, checkbox.

since some of the fields aren't require on my form, when I POST their
values they are returned as 'undefined'

is there a way in Jquery that would allow me to set all variables that
are undefined with a given value like N/A or even just ?

for example, after the form is submitted, I'm using the following code
to populate my values:
//cancer vars
var cancerVal = $(input[name='cancer']:checked).val();
var cancerTypeVal = $(#cancerType).val();
var cancerDateVal = $(#cancerDate).val();
var chemoCanVal = $(input[name='chemoCan']:checked).val();
var radiationCanVal = 
$(input[name='radiationCan']:checked).val();
var surgeryCanVal = $(input[name='surgeryCan']:checked).val();
var otherCanMoreVal = 
$(input[name='otherCanMore']:checked).val();

doing something like:

var chemoCanVal =;

before the submit does not seem to help.

Alternately, if there is a way that I can use a function to replace
all instances of 'undefined' with another value after the form is
submitted, that too would work.

thanks in advance!

cheers,
-robert