Values disappearing in form

Hi,

The following code is supposed to display and hide fields when clicking on radio buttons which is does correctly, it also gives the fields that are hidden a value so that it passes validation. T

The problem is that when the user moves from one field to the next, it deletes the value that they have just entered. :S Any ideas why this might occur? Thanks!

<script language="javascript" type="text/javascript">
		
    		 function showHideDivs(){
                var category = '';

                for(i=0; i < oRadBtns.length; i++){
                    if(oRadBtns[i].checked){
                        category = oRadBtns[i].value;
                    }
                }
                switch (category){

                        case 'empresa':
						document.getElementById("empresa_nombre").value = "";
      					document.getElementById("contacto").value = "";
                        document.getElementById("nombre").style.display = "none";
                        document.getElementById("apellido").style.display = "none";
                        document.getElementById("company").style.display = "block";
                       	document.getElementById("contact").style.display = "block";
						document.getElementById("firstname").value = "nombre";
      					document.getElementById("lastname").value = "apellido";
                        break;

                    	case 'particular':
                        document.getElementById("firstname").value = "";
      					document.getElementById("lastname").value = "";
      					document.getElementById("nombre").style.display = "block";
                        document.getElementById("apellido").style.display = "block";      
                        document.getElementById("company").style.display = "none";
                        document.getElementById("contact").style.display = "none";
      					document.getElementById("empresa_nombre").value = "empresa";
      					document.getElementById("contacto").value = "contacto";
     					 break;
                }

            }
			
			 window.onload=function(){
                oRadBtns = document.getElementById('dmsfrm').getElementsByTagName('input');
                for(i=0; i < oRadBtns.length; i++){

                    oRadBtns[i].onclick = showHideDivs;
                }
				
                showHideDivs();
            }
			 
		</script>
      <div class="radio_element">
					<input type="radio" value="empresa" class="radio" id="empresa" name="categoria" <?php echo ($leadsEngine->getElementValue('categoria')!='particular')?'checked="checked"':'' ?>  />
                    <span class="<?PHP if($leadsEngine->hasError('categoria')){echo 'error';} ?> ">Empresa</span>
             </div>
            <div class="radio_element">
					<input type="radio" value="particular" class="radio" id="particular" name="categoria" <?php echo ($leadsEngine->getElementValue('categoria')=='particular')?'checked="checked"':'' ?> />
                    <span class="<?PHP if($leadsEngine->hasError('categoria')){echo 'error';} ?>  ">Particular</span>
            </div>
	</div>

Your onload function does

oRadBtns = document.getElementById('dmsfrm').getElementsByTagName('input');
                for(i=0; i < oRadBtns.length; i++){

                    oRadBtns[i].onclick = showHideDivs;
                }

presumably this is getting input elements from a form with an id of dmsfrm. This will pick up your (sometimes) hidden input fields which will have an onclick event attached to them. If you click on one of your (sometimes) hidden input fields then showHideDivs will execute. showHideDivs determines what radio button is executed and performs an action which includes clearing various values.