I have a hiring form that contains a dropdown menu for selecting the type of position being hired for; based on what is selected I want certain fields to either show or hide.  It works perfectly in the live form, but when the form saves to the repository all of those fields are shown, regardless of which position type was selected.  I'm using javascript instead of field rules because all of the fields in question are from lookup results.

After scouring the forum it looks like it may be an issue with read-only and repository versions of the form processing javascript and css differently (or rendering the data differently so that the same js/css coding doesn't work right).  I've tried using .text() instead of .val(), passing the value to a variable and calling it in the "if" statement instead, and having the function copy the value of the dropdown into a single line field and calling from that but it hasn't made a difference.

What I find strange is that even if there's something wrong with the function I'm using to show/hide fields based on what was selected, there are a couple of statements (the "$('.teacher').hide();" and "$('.para').hide();" statements) that to me would mean I'd have a problem with the fields NOT showing when I want to rather than all of them showing.

Here's the scripting I've got so far, forgive me if it's messy or clumsy, this is my first experience with javascript.  I do have the css classes I'm using applied correctly; as I said this is working perfectly in the live form.

$(document).ready(function () {
    $('.ro input').attr('readonly','True');
  	$('.ro select').attr('readonly','True');
  
    $('.dobcheck').on('blur', 'select', fillinfo);
  	$('.dobcheck').on('click', fillinfo);
  	$('.dobcheck').on('change', fillinfo);
  
    $('.checkinfo').on('blur', 'select', fillinfo);
  	$('.checkinfo').on('click', fillinfo);
  	$('.checkinfo').on('change', fillinfo); 
  	fillinfo();

  	$('.checkpercent').on('blur', 'select', percentage);
  	$('.checkpercent').on('click', percentage);
  	$('.checkpercent').on('change', percentage);  
  	percentage();
  
  	$('#q256').on('change', autofill);

	var newCurrentStep = $('.currentstep input')[0].getAttribute('default-val');
  	$('.currentstep input').val(newCurrentStep);
	checkcurrentstep();
  
  	$('.teacher').hide();
  	$('.para').hide();
	
  	$('.checkposition').on('blur', 'select', setposition);
  	$('.checkposition').on('click', setposition);
  	$('.checkposition').on('change', setposition); 
  	setposition();
  
  function autofill() {
    $('.autofill').trigger('click');
  }
  	
  	function fillinfo() {
      $('.ro input').removeAttr('readonly');
      $('.ro select').removeAttr('readonly');
      
	  if ($('.process select').val() == "Existing") {
        $('.id input').val($('.empid input').val());
        $('.firstname input').val($('.empfirstname select').val());
        $('.lastname input').val($('.emplastname select').val());
        $('.email input').val($('.empemail input').val());
        $('.dob input').val($('.empdob input').val());
      }
    else {
      $('.id input').val($('.appid input').val());
      $('.firstname input').val($('.appfirstname select').val());
      $('.lastname input').val($('.applastname select').val());
      $('.email input').val($('.appemail input').val());
      $('.dob input').val($('.appdob input').val());
    }   

      }
  
      $('.ro input').attr('readonly','True');
      $('.ro select').attr('readonly','True');  

  function percentage() {
  	if (($('.percent input').val() != 100) && ($('.currentstep input').val() == "Employment Change - Payroll")) {
       	$('.percerror').show();
        $('.Submit').hide();
      }
      else {
        $('.percerror').hide();
        $('.Submit').show();
      }
	}
  
  function checkcurrentstep() {
    if (($('.currentstep input').val() == "Employment Change - Payroll") || ($('.currentstep input').val() == "Employment Change Verification - Payroll")) {
      $('.payrollinfo').show();
      $('.payrollreq label').append('<span class="cf-required">*</span>');
      $('.payrollreq input').attr('required','True');
      $('.prevpayroll').addClass("sectioncomplete");
      $('.payrollro input').attr('readonly',true);
  	  $('.payrollro select').attr('disabled',true);  
    } else if ($('.currentstep input').val() == "Employment Change - HR") {
      $('.payrollinfo').hide();
      $('.hrro input').attr('readonly',true);
  	  $('.hrro select').attr('disabled',true); 
      $('.prevhr').addClass("sectioncomplete");
    } else {
      $('.payrollinfo').show();
    }
} 
  
  function setposition() {
    $('.positionvar input').val($('.checkposition select').val());
	
    if (($('.checkposition select').val() == "Teacher") || ($('.positionvar input').text() == "Teacher")) {
      $('.teacher').show();
      $('.para').hide();
      $('.nonteacher').hide();
    } else if (($('.checkposition select').val() == "Paraprofessional") || ($('.positionvar input').text() == "Paraprofessional")) {
      $('.teacher').hide();
      $('.nonteacher').show();
      $('.para').show();
    } else {
      $('.teacher').hide();
      $('.para').hide();
      $('.nonteacher').show();
    }
  }
  
      $('.Reject').click(function(){
   if($('#comments').val() == '')
   {
      alert('Please fill out the Comments box before selecting this action');
      return false;
  }
    });
    
});