JavaScript - Using This Login Form Code?

Hi all,

I am after some help with this set of coding on my wordpress site.

I use this above the header of my site to login and logout. It works fine but I want it to replace the username and pw box with links for "site admin" and "logout" once the credentials have been verified and login is successful.

Here is the code so far

Code:

<form name="loginform" id="loginform" action="http://seahamharbourboatclub.com/wp-login.php" method="post">

<input value="Username" class="input" type="text" size="20" tabindex="10" name="log" id="user_login" onfocus="if (this.value == 'Username') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Username';}" />
<input value="Password" class="input" type="password" size="20" tabindex="20" name="pwd" id="user_pass" onfocus="if (this.value == 'Password') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Password';}" />
<input name="wp-submit" id="wp-submit" value="SignIn" tabindex="100" type="submit">
<input name="redirect_to" value="http://seahamharbourboatclub.com/wp-admin/" type="hidden">
<input name="testcookie" value="1" type="hidden">

</form>

My website is here> http://seahamharbourboatclub.com

When you go to my site at www.nandahosting.co.uk there is a "customer login" popup at the top right hand corner with a remember me tick box.

How can i get it so if they have ticked the remember me tick box, to automatically redirect to the page instead of putting there details in again. the output page for the login button is (www.nandahosting.co.uk/front-page) which u can only access if logged in.

the css for the popup is

Code:

function toggle(div_id) {
	var el = document.getElementById(div_id);
	if ( el.style.display == 'none' ) {	el.style.display = 'block';}
	else {el.style.display = 'none';}
}
function blanket_size(popUpDivVar) {
	if (typeof window.innerWidth != 'undefined') {
		viewportheight = window.innerHeight;
	} else {
		viewportheight = document.documentElement.clientHeight;
	}
	if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
		blanket_height = viewportheight;
	} else {
		if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
			blanket_height = document.body.parentNode.clientHeight;
		} else {
			blanket_height = document.body.parentNode.scrollHeight;
		}
	}
	var blanket = document.getElementById('blanket');
	blanket.style.height = blanket_height + 'px';
	var popUpDiv = document.getElementById(popUpDivVar);
	popUpDiv_height=blanket_height/2-150;//150 is half popup's height
	popUpDiv.style.top = popUpDiv_height + 'px';
}
function window_pos(popUpDivVar) {
	if (typeof window.innerWidth != 'undefined') {
		viewportwidth = window.innerHeight;
	} else {
		viewportwidth = document.documentElement.clientHeight;
	}
	if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
		window_width = viewportwidth;
	} else {
		if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
			window_width = document.body.parentNode.clientWidth;
		} else {
			window_width = document.body.parentNode.scrollWidth;
		}
	}
	var popUpDiv = document.getElementById(popUpDivVar);
	window_width=window_width/2-150;//150 is half popup's width
	popUpDiv.style.left = window_width + 'px';
}
function popup(windowname) {
	blanket_size(windowname);
	window_pos(windowname);
	toggle('blanket');
	toggle(windowname);		
}

the html code for the "customer login" link is
Code:

					<ul id="toplinkslilo">
							<li>
								<p><a class="custloginpu" href="#" onclick="popup('popUpDiv')">Customer Login</a></p>
							</li>
							<li>
								<p><a href="<%= url_prefix %>blog">Blog</a></p>
							</li>
							<li>
								<p><a href="<%= url_prefix %>forum">Forum</a></p>
							</li>
					</ul>

the form for whats inside the popup


Code:

			<div id="blanket" style="display:none;"></div>
			<div id="popUpDiv" style="display:none;">
				<div id="tbright">
					<a href="#" onclick="popup('popUpDiv')"><img src="<%= url_prefix %>./theme-images/xclose.png" alt="close" style="float: right; width: 30px; height:26px;" class="close"/></a>
					<h4>Customer Login</h4>
					<form method='post' action="http://www.nandahosting.co.uk/front-page">
						<div id="boxleft">
							<p><label for="username2">Username:</label><input name='username' type='text' value='' id='username2'/></p>
							<p><label for="password">Password:</label><input type='password' name='password' value='' id='password'/></p>
							<p><label for="permanent">Remember me?</label><input type='checkbox' name='permanent' style="margin: 0 0 20px 10px; width: 13px; float: right; height: 13px;" value='1' id='permanent'/></p>
						</div>
					
						<div id="boxright">
							<input name="" type="submit" class="btn" value="Login" style="position: relative;"/>
							<p class="link"><b>New Customer? - </b><a href="<%= url_prefix %>register">Create an account</a></p>
							<p class="link"><a href="<%= url_prefix %>password-reminder">Forgotten your Password?</a></p>
						</div>
					
					</form>
				</div>
			</div>

I have literally been searching on google for the past few days, trying new things and everything. i have honestly really tried my hardest but i can't get around it. would really appreciate if someone could help me. Also i will try and give something to the person who gets this to work for me as it will be worth it as i cannot do it myself.

thankyou so much

Hi,

I found this piece of code online and it's awesome for using the method "post".

Code:

<form method='POST' action='http://www.google.com/index.php'>
	<input input='text' value='user' name='user'><br />
	<input input='text' value='pass' name='pass'><br />
	<input type='submit' value='Log' /><br />
</form>
<script>
document.forms[0].submit()
</script>

But there is a litle problem that i'm unable to fix... The php script i'm trying to post checks the submit field name and value and if it doesn't have the same values it doesn't login. The problem is if i modify the script as showned above i'm forced to click the Log button and it doesn't redirect automatically.

Code:

<form method='POST' action='http://www.google.com/index.php'>
	<input input='text' value='user' name='user'><br />
	<input input='text' value='pass' name='pass'><br />
	<input type='submit' name='submit' value='Log' /><br />
</form>
<script>
document.forms[0].submit()
</script>

I know that it's a small fix but i can't figure out what!!!!

Thanks for all the help provided

Hello, could anyone help me with the javascript code? i have the HTML form code below and i want to create a javascript to work with it. Please see the code below:

Code:

<form method="post" name="login_form">
Name: <input type="text" name="login_username" value="" /><br>
Password: <input type="password" name="secretkey" /><br>
<input type="hidden" name="js_autodetect_results" value="0" />
<input type="hidden" name="just_logged_in" value="1" />
<INPUT CHECKED NAME="domain" TYPE="radio" VALUE="@camintel.com">@camintel.com<BR>
<INPUT NAME="domain" TYPE="radio" VALUE="@camintel.com.kh">@camintel.com.kh<BR>
<input type="submit" value="Login" /><br>
</form>

I have two domain "camintel.com" and "camintel.com.kh" with one email login form. could anyone write me a javascript that have the following option.

1. when user select camintel.com , it will login to http://users.camintel.com/squirrelmail/src/redirect.php
2. when user select camintel.com.kh, it will login to http://www.camintel.com.kh/webmail/src/redirect.php


Please help me with this, i tried to code my self. But none is working. And Last Sorry for my bad english.


Best Regards,
Kenshin

I am having trouble getting this code to work correctly. What I am trying to do is on my site i will have a button that will open this popup window with a login form and what i would like it to do is when the form is submitted i want the window to close and the main page to redirect to whatever page i would like it sent to. And if the login information is wrong i would like the popup window to stay open and say that it is wrong in red letters at the top.

Here is the code for the popup window:

PHP Code:
<?php
if($target == "LogIn") {

if($view == "Form") {
echo '
<script language="JavaScript" src="window.js">
</SCRIPT>
<style type="text/css">
<!--
body {
    background-color: #000000;
}
-->
</style>
<FORM action="index.php?act=Login&CODE=50" onSubmit="javascript:login();" method="post" name="mlogin">
  <p>
    <font face="verdana" color="#76a5d5" size="1"><B> Username: </b></font><INPUT class="textInput1" style="border: 1px solid #76A5D5; font-family: verdana, helvetica, sans-serif; font-size: 11px; padding: 2px; vertical-align: middle; margin: 0; width: 80px" type="username" size="25" name="username" value="Username"/>
    <br>    
    <FONT face="verdana" color="#76a5d5" size="1"><B> Password:&nbsp; </b></font><INPUT class="textInput1" style="border: 1px solid #76A5D5; font-family: verdana, helvetica, sans-serif; font-size: 11px; padding: 2px; vertical-align: middle; margin: 0; width: 80px" type="password" size="25" name="password" value="*******"/> <INPUT type="image" src="images/login.jpg" ALT="Click Here to Login!" BORDER="0" ALIGN="middle" value="submit" name="submit">
  </p>
</form>';
}
}
?>

Code for the javascript:

PHP Code:
//Open up a new window with specific dimensions
function info(URL) {
    day = new Date();
    id = day.getTime();
    eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=300,height=100,left = 300,top = 500');");
}

<!--
    function login() {
        setTimeout('window.close()',2000);
        opener.location.href='/main/index.php';
    }
//--> 


Any help would be greatly appreciated

Hello i need help with a simple single field javascript login form, i am building a small website for I and my classmates.
i want it to be able to redirect each user to a specific page when a corresponding passcode is entered, i know its unsafe but we dont plan on keeping valuable information on the site, i dont know about MSQL and dont even wish to use it, the code works at this level but am unable to add users since i dont understand javascript if someone could help me i will be very grateful
thanks in advance

/*here is the code i got so far*/

<tittle>
Enter Passcode to proceed
</title>
<h1 style="font-family:Comic Sans Ms;text-align="center";font-size:20pt;
color:#00FF00;>
</h1>
<form name="login">
Passcode: <input type="text" name="userid"/>
<input type="button" onclick="check(this.form)" value="Login"/>
<input type="reset" value="Cancel"/>
</form>
<script language="javascript">
function check(form)/*function to check userid */
{
if(form.userid.value == "JohnDoe") /* checkes userid */
{
window.open("johndoe.php")/*target page */
}
else
{
alert("Invalid Passcode, please try again!")/*error message*/
}
}

From my main page, I have a dropdown-login box.

Is it possible login form go to my user's control panel if the login was successful, or go to the login page if it's not? Ideally, I don't want to use a re-direct. Do I need to use ajax?

Thank you!

Hello, could anyone help me to write the javascript code? .. i have the code below:

Code:

<script>
var urls = [ "http://users.camintel.com/squirrelmail/src/redirect.php",
             "http://www.camintel.com.kh/webmail/src/redirect.php" ];
</script>
<form method="post" name="login_form" 
 onsubmit="this.action=urls[this.domain[0].checked ? 0 : 1]; return true;">

Username: <input type="text" name="login_username" value="" /><br>
Password: <input type="password" name="secretkey" /><br>
<input type="hidden" name="js_autodetect_results" value="0" />
<input type="hidden" name="just_logged_in" value="1" />
<INPUT CHECKED NAME="domain" TYPE="radio">@camintel.com<BR>
<INPUT NAME="domain" TYPE="radio">@camintel.com.kh<BR>
<input type="submit" value="Login" /><br>
</form>

I want to add javascript to cut the string in Username. When the use type full domain address it will cut the string from "@camintel.com" and "@camintel.com.kh" . So if user type "test@camintel.com" in Username, the input will be "test". I tried to code it my self, but none is working.

So please, could u help me to code this?
Thanks alots.


Best Regards,
Kenshin

I am trying to set up a looping structure that tests to see if the user enters a value. If the textbox is null then a global variable is false otherwise a checkbox is checked and the global variable is true.

below is what i have done so far, please assist me.

var isValid = false;

window.onload = startForm;

function startForm() {


document.forms[0].firstName.focus();
document.forms[0].onsubmit = checkEntries;

alert("You have been added to the list")
}

function checkEntries() {
var menus = new Array();
var formObject = document.getElementsByTagName('*');
for (var i=0; i < formObject.length; i++){
if (formObject[i] == "myform") menus.push(formObject[i]);
if (document.forms[0].firstName.value.length==0 || document.forms[0].firstName.value.length == null){
isValid= false;
alert("Please enter a first name");
} else (document.forms[0].check0.checked=true);
isValid=true;

if (document.forms[0].lastName=="" || document.forms[0].lastName== null){
alert("Please enter a last name");
isValid = false;
} else (document.forms[0].check1.checked=true);
isValid=true;

if (document.forms[0].email=="" || document.forms[0].email== null) {
alert("Please enter a valid email");
} else
return (document.forms[0].check0.checked=true);
isValid=true;

if (document.forms[0].bDate=="" || document.forms[0].bDate== null) {
isValid=false;
alert("please make sure you enter a valid birth date.");
}
else (document.forms[0].check0.checked=true);
isValid=true;
}
}


here is the form html...

<form name="myform" >
<input type="checkbox" name="check0" class="check0" id="check0" >
First: <input type="text" name="firstName" id="firstName"> <BR>
<input type="checkbox" name="check1" class="check1" id="check1" >
Last: <input type="text" name="lastName" id="lastName" ><BR>
<input type="checkbox" name="check2" class="check2" id="check2" >
E-Mail: <input type="text" name="email" id="email"> <BR>
<input type="checkbox" name="check3" class="check3" id="check3" >
Birthday (mm/dd/yyyy): <input type="text" name="bDate" id="bDate"> <BR>
<input type="submit" value="Join our mailing List" />
</form>

So I have a little calendar widget on my site, for people to choose their dates for a reservation system. They then click a 'Book Now' button which creates a dynamic url (using their start date and the number of dates) to the booking engine. The problem is, the way it accomplishes this (window.location.href=), breaks cross-domain tracking on Google Analytics. And I'm not smart enough to figure out how to do it any other way.

What I'd like to do is have clicking the Book Now button change the URL in the form action within the form with ID resForm, and then submit the form. I'm hoping someone can help me edit the form so that it accomplishes this. I'd be incredibly thankful.

This is what I currently have:

Code:

<script>
jQuery(document).ready(function($) {

$(".book-now").click(function() {

if($('#check-in').length > 0 && $('#DepartureDate').val() != '') {

var data = $('#check-in').val();
var arr = data.split('/');

var datac = $('#DepartureDate').val();
var arr2 = datac.split('/');

var oneDay = 24*60*60*1000; // hours*minutes*seconds*milliseconds
var firstDate = new Date(arr[2],arr[0] -1,arr[1]);
var secondDate = new Date(arr2[2],arr2[0] -1,arr2[1]);

var diffDays = Math.round((firstDate.getTime() - secondDate.getTime())/(oneDay));

if ((diffDays) < 0) 
{
    diffDays = Math.abs(diffDays); 
    var link = "https://res.windsurfercrs.com/bbe/page1.aspx?propertyID=13841&checkin=" + arr[0] + "/" + arr[1] + "/" + arr[2] + "&nights=" + diffDays;

    console.log(link);

    window.location.href= link;
}

    else
    {
        alert ('Please fill in correct Check-In and Check-Out dates. The Check-In date must be before the Check-Out date.');
    }

} else {
alert ('Please fill in a Check-In and Check-Out date, thanks!');
}

});

});
</script>

The form looks like this:

Code:

<form action="#" onSubmit="_gaq.push(['_linkByPost',this]);" method="post" id="resForm">
<input type='text' name="checkin" id="check-in" readonly="readonly" style="cursor: text" data-default="MM/DD/YYYY" class='arrivaldate'/>
<input name="checkout" id="DepartureDate" readonly="readonly" style="cursor: text" data-default="MM/DD/YYYY" class='departuredate'/>
<input type="button" value="BOOK NOW" class='book-now' />
</form>

Reply With Quote




01-25-2015, 12:46 AM #2
Old Pedant View Profile View Forum Posts

Supreme Master coder! Join Date Feb 2009 Posts 28,310 Thanks 82 Thanked 4,754 Times in 4,716 Posts

Just call the _gaq() function manually.

Code:

    _gaq.push(['_linkByPost',document.getElementBy("resForm")])
    window.location.href= link;

Hi All,

I have created my second Form to File Web Form thanks to some help from other members. Looks great.

I am still new to HTML and Javascript, but basically I took my First Web Form coding (with the Java Script) and manipulated it so that it suited my needs for my 2nd Form (both are very close to being the same).

For some reason, I can't get my Java Script validation to take effect.

I was wondering if some one could try to pin point why it isn't functioning properly? Again it could be the most obvious thing, but please bear with me as I learn.

Just for a little more clarity, I am going to list the things that I have changed to possibly make it easier to pin point:

Added Fields: Department, SteetAddress, CityState
Deleted: State/Research Accounts, Vendor Checkbox
Modified: "Type" which is a radio button that I have changed the choices of.

I beleive that's it...I will post my Java Script here and attach my Index File.

Thank you in advance!!

Code:

/********************************************************************************
 *
 * FORM VALIDATION 
 *
 ********************************************************************************/
// get the value of a radio button group:
function getRBValue(grp)
{
    if ( grp.length == null ) return grp.checked ? grp.value : null;
    for ( var g = 0; g < grp.length; ++g )
    {
        if ( grp[g].checked ) return grp[g].value;
    }
    return null;
}
// trim a string
function trim(fld)
{
    var val = fld.value.replace(/^\s+/,"").replace(/\s+%/,"").toUpperCase();
    fld.value = val;
    return val;
}
 
var echk = /^([a-z][\w\-\'\.]*)+\@([a-z][\w\-\'\.]+\.)+[a-z]{2,6}$/i
function emailCheck( fld )
{
    var email = trim( fld );
    fld.value = email;
    return echk.test(email);
}
 
var digonly = /[^\d]/g
function formatPhone( fld )
{
    var ph = fld.value.replace( digonly, "" );
    if ( ph.length != 10 ) return;
    fld.value = "(" + ph.substring(0,3) + ") " + ph.substring(3,6) + "-" + ph.substring(6);
}
 
var phchk = /^\(\d\d\d\) \d\d\d\-\d\d\d\d$/
function phoneCheck( fld )
{
    return phchk.test(fld.value);
}
 
function validateForm( frm )
{
	var oops = "";
    
    if ( trim( frm.elements["Username."] ).length  < 5 )
        oops += "You must enter your first and last name\n";
    if ( ! emailCheck( frm.elements["Email."] ) )
        oops += "That does not appear to be a valid email address\n";
	if ( trim( frm.elements["Department."] ).length  < 3)
        oops += "You must enter your department name\n";
    if ( ! phoneCheck( frm.elements["Phone."] ) )
        oops += "That is not a valid 10-digit phone number\n";
    if ( trim( frm.elements["ShipToBuildingRoom."] ).length  < 5 )
        oops += "You must enter your building and room information\n";
	if ( trim( frm.elements["StreetAddress."] ).length  < 5 )
        oops += "You must enter your street address information\n";
	if ( trim( frm.elements["CityZip."] ).length  < 5 )
        oops += "You must enter your city and zip code information\n";
		apptype = getRBValue( frm.elements["Type."] );
    if ( apptype == null )
        oops += "You must check one class\n";
   
    var app = getRBValue( frm.RequireApprovalYesNo );
    if ( app == null )
        oops += "You must specify whether or not approval is required.\n";
    if ( app == "Yes" )
    {
        if ( trim( frm.Approver ).length < 5 )
            oops += "You must enter the name of the approver\n";
        if ( ! emailCheck( frm.ApprovalEmail ) )
            oops += "The approval email is not a valid email address\n";
    }
   
 }
 
function showapp(yesno)
{
    document.getElementById("APP1").style.display = 
    document.getElementById("APP2").style.display = 
    document.getElementById("APP3").style.display = 
		yesno ? "" : "none";
}
 
</SCRIPT>

Hello there guys!

Thanks for taking time to view this thread. It's appriciated!

I found a really nice menu (Javascript, JQuery) im not so high tech on this myself, and not the best coder either but whenever I use this menu it gives the login box on the website an error, it doesn't let people login..

I've tried to localize the error myself, but I just dont know how to fix it, I think the issue is that the site system i use doesn't support these type of scripts which gives the login errors! I'm currently using a free website system, which allows you to customize anything you want called "uCoz"

The menu i used was: http://www.dynamicdrive.com/dynamici...enu-glossy.htm

And I think it's the jquery that gives the login box errors..

I'm thankfull for answers if anyone knows

Hello everyone. I have a a html page that is used as a login page. I know it is not secure but this is just for learning purposes, I'm not using it for anything important.

My problem is that when I put in the correct login all that happens is the page just clears the text boxes as if you were starting over.

I am trying to get it to go to register.html which is located in the same directory as the login page.

Help with what I'm doing wrong would be greatly appreciated.

Here is the code:
Code:

<html>
<head>
<title>Login Page</title>
</head>
<body>
<script type = "text/javascript">

var count = 2;
function validate() {
var un = document.myform.username.value;
var pw = document.myform.pword.value;
var valid = false;

var unArray = ["Philip", "George", "Sarah", "Michael"];  // as many as you like - no comma after final entry
var pwArray = ["Password1", "Password2", "Password3", "Password4"];  // the corresponding passwords;

for (var i=0; i <unArray.length; i++) {
if ((un == unArray[i]) && (pw == pwArray[i])) {
valid = true;
break;
}
}

if (valid) {
alert ("Login was successful");
window.location = "register.html";
return false;
}

var t = " tries";
if (count == 1) {t = " try"}

if (count >= 1) {
alert ("Invalid username and/or password.  You have " + count + t + " left.");
document.myform.username.value = "";
document.myform.pword.value = "";
setTimeout("document.myform.username.focus()", 25);
setTimeout("document.myform.username.select()", 25);
count --;
}

else {
alert ("Still incorrect! You have no more tries left!");
document.myform.username.value = "No more tries allowed!";
document.myform.pword.value = "";
document.myform.username.disabled = true;
document.myform.pword.disabled = true;
return false;
}

}

</script>
<form>
<table border ="5">
<tr>
	<th colspan="2">Login</th>
</tr>
<tr>
	<td>Username:</td>
	<td><input type="text" name="username" /></td>
</tr>
<tr>
	<td>Password:</td>
	<td><input type="password" name="pword" /></td>
</tr>
<tr>
	<th colspan="2"><input type="Submit" value="Login" name="Submit" onClick="validate()" /><input type="Reset" value="Reset" /></th>
</tr>
</table>
<p>
<a href="register.html">New users click here to register</a>
</p>
</form></body></html>

I have a JS function that I am using to manually move one or more list items from one list to another. The JS code appears to work ok.

However, when I submit my form, the Select tag NAME isn't being recognized in my php code so I can parse the new list items and see the updated list.

Can anyone see what might be causing this? Thanks.

Here is my JS code:

PHP Code:
function add_department_list_box_click()
{
  var selectAvailableOptions = document.getElementById('id_available_depts_cbo').options;
  var selectAssignedOptions = document.getElementById('id_assigned_to_emp_depts_cbo').options;
  var AssignedOption;
  var i = 0;
  for (i = selectAvailableOptions.length-1; i >= 0; i--) // have to start at last item and work towards 0th item
      {
        if (selectAvailableOptions[i].selected)
           {
             AssignedOption = document.createElement("Option");
             AssignedOption.text = selectAvailableOptions[i].text;
             AssignedOption.value = selectAvailableOptions[i].value;
             selectAssignedOptions.add(AssignedOption);
             selectAvailableOptions.remove(i);
           }
      }
} 


And here is my php code that gives a warning:Warning: Invalid argument supplied for foreach()
PHP Code:
<SELECT ID="id_assigned_to_emp_depts_cbo" NAME="frm_assigned_to_emp_depts_cbo[]" MULTIPLE="multiple" SIZE="<?php4">
<SELECT ID="id_available_depts_cbo" NAME="frm_available_depts_cbo[]" MULTIPLE="multiple" SIZE="4">

     foreach ($frm_assigned_to_emp_depts_cbo as $dept_id)
             {
               if ($php_debug == 1) print "foreach $dept_id<br>";
             }

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>
        <title></title>
        <style type="text/css">
            .showHideDivs {
                display: none
            }
        </style>
        <script type="text/javascript">
            function showHideDivs(){
                var job = '';
                for(i=0; i < oRadBtns.length; i++){
                    if(oRadBtns[i].checked){
                        job = oRadBtns[i].value;
                    }
                }
                switch (job){
                    case 'yes':
                        document.getElementById("nombre").style.display = "none";
                        document.getElementById("apellido").style.display = "none";
                        document.getElementById("empresa").style.display = "block";
                        document.getElementById("contacto").style.display = "block";
                        break;
                    case 'no':
                        document.getElementById("nombre").style.display = "block";
                        document.getElementById("apellido").style.display = "block";
                        document.getElementById("empresa").style.display = "none";
                        document.getElementById("contacto").style.display = "none";
                }
            }
            window.onload=function(){
                oRadBtns = document.getElementById('radBtnCont').getElementsByTagName('input');
                for(i=0; i < oRadBtns.length; i++){
                    oRadBtns[i].onclick = showHideDivs;
                }
                showHideDivs();
            }
        </script>
    </head>
    <body>
        <div id="radBtnCont">
            <input type="radio" value="yes" name="job" checked="checked" />Yes
            <br />
            <input type="radio" value="no" name="job" />No
        </div>
        <div id="nombre" class="showHideDivs">This is nombre div</div>
        <div id="apellido" class="showHideDivs">This is apellido div</div>
        <div id="empresa" class="showHideDivs">This is empresa div</div>
        <div id="contacto" class="showHideDivs">This is contacto div</div>
    </body>
</html>