Learn VBA & Macros in 1 Week!

JavaScript - How Do I Program A Radio Button To Open An "invisible" Input Field?

Full Excel VBA Course - Beginner to Expert

How Do I Program A Radio Button To Open An "invisible" Input Field?	View Content

Hello everyone. I'm new to programming, although I've learned HTML and CSS pretty thoroughly. I think I have most of the Javascript basics down as far as definitions, but I'm getting hung up on the actual coding.

I'm working on an information request form for my fiancee's business site. In it, I want to have options that users select via radio buttons. Rather than having additional input fields static on the page, I would like to program some of the radios, when clicked, to open a previously unseen option where users will then be able to type in the necessary information. More specifically, since she only works in two states, I want a third option of "other," which, when opened, will allow the user to input any other state. Then, should the radio be deselected or reset, the field would disappear again.

If my understanding is correct, I think I will need to use a javascript function in the header, an HTML "div" section with ID, "onclick" and "offclick" events in the button mark-up, and the specific javascript code to call the function (getElementById?). Or maybe I'm way off.

Please help. Thanks

Full Excel VBA Course - Beginner to Expert

Code For Radio Button "yes"-2 Additional Fields Are Required

Similar Tutorials

View Content

Hi All,

I am very new to HTML programming and Javascripts.

What I am trying to accomplish is I have a radio button "RequiredApprovalYesNo". When the selection is "Yes", I need fields "Approver" and "ApproverEmail" to be required upon submit. I also need to make sure that a selection is made with this radio button of either Yes or No.

Here is my HTML code for these three fields and was wondering if someone could show me how to code this script or, give me an example of a Radio button selection resulting in additional fields being required or not.

Thank you in advance.

Code:

<td>
  <input type="radio" name="RequireApprovalYesNo" id="RequireApprovalYesNo" value="Yes">Yes
                
  <input type="radio" name="RequireApprovalYesNo" id="RequireApprovalYesNo" value="No">No
                </tr>
              <tr>
                <td><table width="190" border="0" align="right" cellspacing="0">
                  <tr>
                 </tr>
                </table></td>
              <tr>
                <td colspan="3"><div align="left"><em><strong><b style= 'color: red;'>If Yes, You Must Enter an Approver with a corresponding Email:</b> </strong></em></div></td>
                </tr>
              <tr>
                <td height="25"><div align="right">Approver:</div></td>
                <td>&nbsp;</td>
                <td><input name="Approver" type="text" id="Approver" size="40";"></td>
              </tr>
              <tr>
                <td height="25"><div align="right">
                  <p>Approver's Email: </p>
                  </div></td>
                <td>&nbsp;</td>
                <td><input name="ApprovalEmail" type="text" id="ApprovalEmail" size="40"></td>
              </tr>
              <tr>

Radio Button "choose One" Problem

Similar Tutorials

View Content

Hi, I want the user to choose one option in each of the radio group. But when I click only one button out of all 12 buttons, it allows the user to submit. How do I change it to a way that the user must click one option for each group in order to allow him/her to submit the form?

Javascript
Code:

function valbutton(thisform) 
{
    // place any other field validations that you require here
    // validate myradiobuttons
    myOption = -1;
    for (i=thisform.myradiobutton.length-1; i > -1; i--)
    {
        if (thisform.myradiobutton[i].checked)
        {
            myOption = i; i = -1;
        }
    }
    
    for (i=thisform.myradiobutton1.length-1; i > -1; i--)
    {
        if (thisform.myradiobutton1[i].checked)
        {
            myOption = i; i = -1;
        }
    }

    for (i=thisform.myradiobutton2.length-1; i > -1; i--)
    {
        if (thisform.myradiobutton2[i].checked)
        {
            myOption = i; i = -1;
        }
    }

    for (i=thisform.myradiobutton3.length-1; i > -1; i--)
    {
        if (thisform.myradiobutton3[i].checked)
        {
            myOption = i; i = -1;
        }
    }
    
    for (i=thisform.myradiobutton4.length-1; i > -1; i--)
    {
        if (thisform.myradiobutton4[i].checked)
        {
            myOption = i; i = -1;
        }
    }

    for (i=thisform.myradiobutton5.length-1; i > -1; i--)
    {
        if (thisform.myradiobutton5[i].checked)
        {
            myOption = i; i = -1;
        }
    }                    

    if (myOption == -1) 
    {
        alert("You must select a radio button");
        return false;
    }

    // place any other field validations that you require here
    thisform.submit(); // this line submits the form after validation
}

HTML

Code:

<p>Cookies</p>
<input type="radio" value="1st value" name="myradiobutton" class="style31" />Enable
<input type="radio" value="2nd value" name="myradiobutton" class="style31" />Enable<br />
<p>Java</p>                                
<input type="radio" value="3rd value" name="myradiobutton1" class="style31" />Enable
<input type="radio" value="4th value" name="myradiobutton1" class="style31" />Enable<br />
<p>Javascript</p>
<input type="radio" value="5th value" name="myradiobutton2" class="style31" />Enable
<input type="radio" value="6th value" name="myradiobutton2" class="style31" />Enable<br />                                   
<p>PHP</p>
<input type="radio" value="7th value" name="myradiobutton3" class="style31" />Enable
<input type="radio" value="8th value" name="myradiobutton3" class="style31" />Enable<br />
<p>C#</p> 
<input type="radio" value="9th value" name="myradiobutton4" class="style31" />Enable
<input type="radio" value="10th value" name="myradiobutton4" class="style31" />Enable<br />
<p>CSS</p>                                     
<input type="radio" value="11st value" name="myradiobutton5" class="style31" />Enable
<input type="radio" value="12nd value" name="myradiobutton5" class="style31" />Enable<br />                                                                                              
<input type="submit" name="submitit" onclick="valbutton(myform);return false;" value="Validate" />
<input type="reset" name="reset" value="Clear" />

"window.open()" Vs. "<a> Hyperlink" ? Anyone Prior To The Another Regarding Security?

Similar Tutorials

View Content

Hello,
recently I have been to many government websites where I have noticed that the programmer has used window.open() method in JavaScript to link to different pages instead of using <a> tags!

I was just getting curious to know whether it is normal or has it been used due to security concerns(if any, I don't know)?

Any comments?

Compare "(" And ")" Count In Text Input

Similar Tutorials

View Content

I need to do an input text validation which include opening parenthesis and closing parenthesis, what I need to validate is the opening parenthesis match with closing parenthesis. Here is a sample of the entry text:

thisis(test(of(matching(parenthesis)and)if)working

There's one closing parenthesis missing. I would like to warn the user to correct it before submit, but not quite sure how to do it with javascript. Please advice.

Thanks
JT

Change Input Type="text" To Input Type="password"

Similar Tutorials

View Content

I need to change input type="text" to input type="password" via JavaScript

Code:

<form id="login" action="#" method="post">
<input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" />
<input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; javascript:this.type='password'; javascript:this.focus();" value="Password" tabindex="2" />
<input type="submit" name="submit" value="sign in" tabindex="3" />
</form>

This works in Firefox and Safari but not IE So then I tried this code

Code:

<script type="text/javascript">
function passit(ip){
var np=ip.cloneNode(true);
np.type='password';
if(np.value!=ip.value)
np.value=ip.value;
ip.parentNode.replaceChild(np,ip);
}
</script>

<form id="login" action="#" method="post">
<input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" />
<input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; passit(this.form[0]); javascript:this.focus();" value="Password" tabindex="2" />
<input type="submit" name="submit" value="sign in" tabindex="3" />
</form>

This does what I need but turns the username type to password field not the password box

Please can somone help!

View 'information' That Is "return"ed By A Javascript Program Running?

Similar Tutorials

View Content

I am pretty novice. I do not know much about the compilers or how these things run. I do however have a good eye for trends and can figure just about anything out by looking at it.

With that;

I have a game that uses a exe launcher with a built in patcher.

I have found the code for the launcher. There are several "jquery" scripts for basic components like scroll wheel. There are also things like "downloader.js", "inputs.js".

I am interested in seeing what (and more precisely how many) ip addresses are being retrieved. I fear this patcher is using a hidden bittorrent like download system.

The code for "downloader" is pretty basic. It clearly uses some other script, but I am wondering if you can point me in the direction of a utility to monitor running JS so that I can see what is being returned.

Code:

_Downloader = function()
{
	this.downloadStatusCallback = null;
}

_Downloader.prototype = 
{

	setDownloadStatusCallback: function(callback)
	{
		this.downloadStatusCallback = callback;
	},

	addDownload: function(downloadName, metaUrl, outputPath, authorizationURL) // returns bool
	{
		return document.SSNLauncher.SSNLauncher_ReturnBool('addDownload', 'string:' +  downloadName + '|' + 'string:' +  metaUrl + '|' + 'string:' +  outputPath + '|' + 'string:' +  authorizationURL + '|');
	},

	removeDownload: function(downloadName) // returns bool
	{
		return document.SSNLauncher.SSNLauncher_ReturnBool('removeDownload', 'string:' +  downloadName + '|');
	},

	getDownloadOption: function(downloadName, optionName) // returns string
	{
		return document.SSNLauncher.SSNLauncher_ReturnString('getDownloadOption', 'string:' +  downloadName + '|' + 'string:' +  optionName + '|');
	},

	setDownloadOptions: function(downloadName, enableBitSources, enableWebSources) // returns bool
	{
		return document.SSNLauncher.SSNLauncher_ReturnBool('setDownloadOptions', 'string:' +  downloadName + '|' + 'bool:' +  enableBitSources + '|' + 'bool:' +  enableWebSources + '|');
	},

	getDownloadActive: function(downloadName) // returns bool
	{
		return document.SSNLauncher.SSNLauncher_ReturnBool('getDownloadActive', 'string:' +  downloadName + '|');
	},

	setDownloadActive: function(downloadName, active) // returns bool
	{
		return document.SSNLauncher.SSNLauncher_ReturnBool('setDownloadActive', 'string:' +  downloadName + '|' + 'bool:' +  active + '|');
	}

}

function __Downloader_reportdownloadStatus(downloadName, state, active, totalBytes, bytesLeft, maxIncoming, averageIncoming, currentIncoming, maxOutgoing, averageOutgoing, currentOutgoing, bytesRead, bytesSent, scanBytesLeft)
{
	if (SSN.Downloader.downloadStatusCallback != null)
	{
		SSN.Downloader.downloadStatusCallback(downloadName, state, active, totalBytes, bytesLeft, maxIncoming, averageIncoming, currentIncoming, maxOutgoing, averageOutgoing, currentOutgoing, bytesRead, bytesSent, scanBytesLeft);
	}
}

I have tried on several occasions to teach myself programing. I can get the commands and syntax fairly easily, and I am pretty good at 'coming up' with ways to get something done. I just don't have experience in this field (I'm in medical school) so I do not know about the tools and utilities programers use and scouring the internet has been less than fruitful.

Anybody capable of pointing me in the direction of finding a utility to monitor running js (if that is even possible =/).

I use dreamweaver CS5 to explore js code.

How To Write "web Site Promotion Program"

Similar Tutorials

View Content

Is it possible to write a 'web site promotion program" - for example, the program will search those PCs using google, and once the users type particular search words, the program will open my web site on that particular PC.

Multiple <textarea> Type="radio" Population Problem

Similar Tutorials

View Content

This script works great for populating predefined lists of data into a textarea as selected by the user using a radio button:

Code:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Populate Textarea Based on Radio Button Selection</title>

<script>
text = new Array()
text[0] = Array('Hotel', 'Motel'); 
text[1] = Array('Couch', 'Bed', 'Chair'); 
function populate(r,f){
t=-1;
for(var i=0;i<f.elements[r].length;i++){
if (f.elements[r][i].checked){
var t=i;
}
}
if(t>-1){
    f.thefirsttextarea.value= text[t].toString().replace(/,/gi,"\n");
}
}
</script>

</head>
<body>
<form name="frm">

 <input type="radio" name="test" value="0" onClick="populate(this.name,this.form)">

 <input type="radio" name="test" value="1" onClick="populate(this.name,this.form)">
 
 <textarea name="thefirsttextarea"></textarea>
<input type="submit" value="submit" />
</form>

</body>
</html>

However, I've coded all night only to come across an issue. I have an inline page style which calls/includes multiple pages. Two of these pages require this feature. It seems one is canceling out the other. Here's an example:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Populate Multiple Textareas Based on Radio Button Selection</title>

<script>
text = new Array()
text[0] = Array('Hotel', 'Motel'); 
text[1] = Array('Couch', 'Bed', 'Chair'); 
function populate(r,f){
t=-1;
for(var i=0;i<f.elements[r].length;i++){
if (f.elements[r][i].checked){
var t=i;
}
}
if(t>-1){
    f.thefirsttextarea.value= text[t].toString().replace(/,/gi,"\n");
}
}
</script>

<script>
textt = new Array()
<!--default-->
text[0] = Array('Ham', 'Turkey', 'Chicken'); 

<!--all-->
text[1] = Array('Beer', 'Soda', 'Water');

<!--johnny havana-->
text[2] = Array('Milk', 'Cheese', 'Butter');


function populate(r,f){
t=-1;
for(var i=0;i<f.elements[r].length;i++){
if (f.elements[r][i].checked){
var t=i;
}
}
if(t>-1){
    f.SECONDFORM.value= text[t].toString().replace(/,/gi,"\n");
}
}
</script>

</head>
<body>
<form name="form">

 <input type="radio" name="test" value="0" onClick="populate(this.name,this.form)">

 <input type="radio" name="test" value="1" onClick="populate(this.name,this.form)">
 
 <textarea name="thefirsttextarea"></textarea>
<input type="submit" value="submit" />
</form>

<form name="anotherform">

 <input type="radio" name="anothertest" value="0" onClick="populate(this.name,this.form)">

 <input type="radio" name="anothertest" value="1" onClick="populate(this.name,this.form)">
 
 <textarea name="SECONDFORM"></textarea>
<input type="submit" value="submit" />
</form>
</body>
</html>

With the above code only the second set of radio buttons work. What I need help with is a way to have two independent sets of arrays the correspond correctly with the textareas - One set that populates textarea 1 and the other that populates textarea 2.

How Many Times We Can Open And Close <script Type="text/javascript"> Tag

Similar Tutorials

View Content

suggestions welcome !!

Using Src="javascript Program"

Similar Tutorials

View Content

Why doesn't this work? Both files are in the same folder. I'm sure I've done this many times before???

HTML File "Test.htm" :-
Code:

<html>
<head>
<script type="text/javascript" src="Test.js"></script>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo">This is a paragraph.</p>
<button type="button" onclick="displayDate()">Display Date</button>
</body>
</html>

javascript File "Test.js" :-
Code:

function displayDate(){
document.getElementById("demo").innerHTML=Date();
}

Inverse Of "onclick" Js Event For Radio

Similar Tutorials

View Content

Code:

  	<input name="radiobutton" type="radio" value="radiobutton" onBlur="aa.style.display='none'"  onClick="aa.style.display='inline'">
	<input name="radiobutton" type="radio" value="radiobutton" onBlur="ab.style.display='none'"  onClick="ab.style.display='inline'">
  	<input name="radiobutton" type="radio" value="radiobutton" onBlur="ac.style.display='none'"  onClick="ac.style.display='inline'">

when i select raido button it will be inline (for this i use "onClick" JS event)

and which event will i use inverse of "onClick" event ?

How Do I Open "search" Contents In A New Window?

Similar Tutorials

View Content

Hey guys! i'm trying to put a search box on my web site but every time i type any thing, it opens the search results on the same page. How can i make the search contents open on a fresh page?

How To Open A "new Window" From Java Menu?

Similar Tutorials

View Content

Hi everyone, I was hoping you could help me with a faily easy question.
I was asked to edit some script and I figured out most of it, however I can't seem to be able to make the links in my java script menu open in new pages.

Any help would be appreciated. Below is a copy of the script.

It's a very long script, so I just sent a section of it. Pleasse scroll down to the bottom to see where the links are (ex. http://www.korg.com, etc)

Thank you, Paul.

Using Lightbox To Open A "page" Of Videos

Similar Tutorials

View Content

Hey All,

I replied in another thread asking about this, but I figured it would be best to have a separate thread for it.

I'm trying to use lightbox (Video Lightbox) to not just open a video when clicking on a thumbnail image, but a mock "page" of several videos, where the main video plays, but there are surrounding thumbnail images that can then also be selected to play in the main player.

Has anyone ever done anything like this? I've seen it done elsewhere, but wasn't sure how to actually implement it.

Any suggestions would be appreciated.

Thanks.

How To Get "confirm Email" Type Field To Work?

Similar Tutorials

View Content

so that the form only submits when 2 fields are identical?

this is the code I am trying to edit

Code:

<div class="title">ENROLLMENT</div>
			<p>You are on your way to receiving <strong>generous cash backs</strong> <em>PLUS</em> a <strong>steady stream of free dinners</strong> just for shopping at your favorite stores!</p> <br />
			<form action="" class="registration" id="cform">
				<div>
					To begin, please complete the following:<br />
					<div class="f11">
						<input type="text" name="name" value="Name:" onfocus="if(this.value=='Name:')this.value=''" /><br />
						<input type="text" name="address" value="Address:" onfocus="if(this.value=='Address:')this.value=''" /><br />
						<input type="text" name="phone" value="Phone:" onfocus="if(this.value=='Phone:')this.value=''" /><br />
						<input type="text" name="email" value="E-mail:" onfocus="if(this.value=='E-mail:')this.value=''" /><br />
						<input type="text" name="confirm" value="Confirm Email:" onfocus="if(this.value=='Confirm Email:')this.value=''" /><br />
						<fieldset style="width:330px">
							How would you like your free restaurant gift certificates sent to you? <br /> <input class="checkbox" name="gift_1" id="c1" type="checkbox" value="yes" /> <label for="c1">U.S. Mail</label> <input class="checkbox" name="gift_2" id="c2" type="checkbox" value="yes" /> <label for="c2">E-mail</label>
						</fieldset>
					</div>
					<br />
					<div class="align-center"><a href="javascript:void(0);" id="sbm"><img alt="" src="images/button-submit.gif" /></a></div>				
				</div>
			</form>
        <center><img src="/images/registration.jpg" ALT="registration" class="border" style="margin-top:20px" /></center>

Code:

/**
 * @author bob4ik
 */
$(document).ready(function(){
    html = '<div id="displayResponse" style="display:none;"><div id="inner">Processing...</div></div>';
    $('#cform').before(html);
    
    $('#sbm').click(function(){
        $('#cform').submit();
    });
    var options = {
        target: '#displayResponse', 	// target element(s) to be updated with server response 
        beforeSubmit: before, 			// pre-submit callback 
    //  success: success, 				// post-submit callback
        url: 'includes/mail.ctrl.php',	// override for form's 'action' attribute 
        type: 'post', 					// 'get' or 'post', override for form's 'method' attribute
        resetForm: true 				// reset the form after successful submit
    };    
    
    // bind to the form's submit event 
    $('#cform').submit(function(){
    	error = '<div id="inner">Processing...</div>';
    	$('#displayResponse').empty();
        $('#displayResponse').append(error);
        $('#displayResponse').toggle();
        $(this).ajaxSubmit(options);
        return false;
    });
});
function before(formData, jqForm, options){
    var error = '';
    var form = jqForm[0];
    if (!form.name.value && !form.email.value && !form.address.value && !form.phone.value && !form.hear.value && !form.confirm.value) {
        error = error + '<div style=""><b>Please fill all fields</b></div>';
    }
    else {
        if (!form.name.value||form.name.value=="Name:")error = error + '<div style=""><b>Please fill &quot;Name&quot; field</b></div>';
		if (!form.address.value||form.address.value=="Address:")error = error + '<div style=""><b>Please fill &quot;Address&quot; field</b></div>';
		if (!form.phone.value||form.phone.value=="Phone:")error = error + '<div style=""><b>Please fill &quot;Phone&quot; field</b></div>';		
		if (!form.c1.checked && !form.c2.checked)error = error + '<div style=""><b>Please fill &quot;How would you like your free restaurant gift certificates sent to you?&quot; field</b></div>';
        if (!form.email.value||form.email.value=="E-mail:")error = error + '<div style=""><b>Please fill &quot;E-mail address&quot; field</b></div>';
        if (!form.confirm.value||form.confirm.value=="Confirm Email:")error = error + '<div style=""><b>Please fill &quot;Confirm E-mail address&quot; field</b></div>';
        if ((form.email.value.match(/[0-9a-z_]+@[0-9a-z_^.]+.[a-z]{2,3}/i) == null) && form.email.value && (form.email.value.match(/^.+@.+\..+$/) == null)&& form.email.value!="E-mail:") {
			error = error + '<div style=""><b>Invalid e-mail</b></div>';
		}
		 if ((form.confirm.value.match(/[0-9a-z_]+@[0-9a-z_^.]+.[a-z]{2,3}/i) == null) && form.confirm.value && (form.confirm.value.match(/^.+@.+\..+$/) == null)&& form.confirm.value!="Confirm Email:") {
			error = error + '<div style=""><b>Invalid e-mail</b></div>';
		}
	}
    if (error != '') {
        error = error + '<br><a href="#" onclick="javascript: $(\'#displayResponse\').toggle(); return false;"><img src="images/close.gif" border="0"></a>';
        error = '<div id="inner">' + error + '</div>';
        $('#displayResponse').empty();
        $('#displayResponse').append(error);
        return false;
    }
    else {
        return true;
    }
}

"on Air Now" Website Script For Radio

Similar Tutorials

View Content

Hey,

I'm looking for a scrupt that looks at the current day and time and displays the relevant text such as "Breakfast Show DJ" between 6 and 10am on weekdays, "Drive Time DJ" between 5 - 8pm, "Sunday Breakfast" Sundays 6-10am, etc etc.

Does anyone know of any links to download such one from, or could possibly post one?

I got a bit of stick when asking for someone to post one before, so please if you're not gonna post one, help me out? I could just stick to using the php shoutcast radio stats, but I'd prefer that the on air dj name change to what the schedule shows.

Don't ask why, it's just me trying out new things. So please can someone help me out?

Many Thanks!

Validation On A Field For A "last Name" While Allowing For An Apostrophe

Similar Tutorials

View Content

Hi guys,

I am trying to re-work some pre-written Javascript code at which I am a novice at (I'm more CSS, HTML, PHP...). I am trying to validate a form field for a Purchaser's last name while accounting for an apostrophe if they have one in their last name.

I bet it's something simple, but I still haven't been able to figure it out, or write it correctly:

Code:

function checkPurchaserName()
{
  var err = false;
  var f = $(getApogeeElement('purchaser_name_first'));
  var l = $(getApogeeElement('purchaser_name_last'));

  if ( f && l &&
       ( f.value.toLowerCase() != first.toLowerCase() ||
         l.value.toLowerCase() != last.toLowerCase() ) )
  {
    error_list[error_list.length] = 'The name of the purchaser must match the applicant.';
    errorHighlight(f);
    err = true;
  }

  return err;
}

As an example. I started the purchasing process with the name "Patrick O'Malley".

At the end page where this validation occurs, they have (2) text boxes, one for "first name" and one for "last name". They must type the same exact name for purchaser that they did for applicant, so "Patrick", then "O'Malley"

Can someone please put me on the right track?

Thanks.

Pass Value Of An Input To A Forms "action" On Submit...

Similar Tutorials

View Content

What needs to be done to have the below input (red) passed to the forms action (blue) when the submit button is pressed. Obviously this should be the user input value and not the default 0.00 one.

Ty.

echo '
<center>
<form method="post" action="https://www.paymate.com/PayMate/ExpressPayment?mid=MoreBloodWine&popup=false&ref=EoJ Market Place Donation&currency=USD&amt= 1.23 &amt_editable=N&return=http://www.eojmarket.com">
Donation Amount: $<input style="vertical-align: middle; color: #FFFFFF; background-color: transparent; border: 1px solid; border-color: #9E853D; padding: 0px 0px 0px 1px; font-size: 10px; width: 50px;" name="amount" type="text" maxlength="6" value=" 0.00 ">
<br />
<input type="image" style="padding-top: 10px; padding-bottom: 10px; border: none;" src="http://www.eojmarket.com/NonForumStuff/images/paymate-donate-button.png" value="Submit" alt="Pay with Paymate Express !"/>
</form>
</center>
';

Help Adding A "skip" Button To A Multi-step Form

Similar Tutorials

View Content

Site in question:

www.yourvancouvermortgagebroker.ca/apply

On the 3rd step of this form, I want to add a "SKIP" button that will send the user to the 5th step. No clue how to do this, as someone else helped me code.

Thank You!

Relevant code

javascript file:

Code:

//step 3
 $('#submit_third').click(function(){
        //remove classes
        $('#third_step input').removeClass('error').removeClass('valid');
        //ckeck if inputs aren't empty
        var fields = $('#third_step input[type=text]');
        var error = 0;
        fields.each(function(){
            var value = $(this).val();
            if( value.length<1 || value==field_values[$(this).attr('id')] || ( $(this).attr('id')=='cemail' && !emailPattern.test(value) ) ) {
                $(this).addClass('error');
                $(this).effect("shake", { times:3 }, 50);
                
                error++;
            } else {
                $(this).addClass('valid');
            }
        });        
        
        if(!error) {

                //update progress bar
                $('#progress_text').html('60% Complete');
                $('#progress').css('width','204px');
                
                //slide steps
                $('#third_step').slideUp();
                $('#fourth_step').slideDown();     
        } else return false;
    });


//step 4
    $('#submit_fourth').click(function(){
        //remove classes
        $('#fourth_step input').removeClass('error').removeClass('valid');
       
        var fields = $('#fourth_step input[type=text]');
        var error = 0;
        fields.each(function(){
            var value = $(this).val();
            if( value.length<1 || value==field_values[$(this).attr('id')]) {
                $(this).addClass('error');
                $(this).effect("shake", { times:3 }, 50);
                
                error++;
            } else {
                $(this).addClass('valid');
            }
        });

        if(!error) {
                //update progress bar
                $('#progress_text').html('80% Complete');
                $('#progress').css('width','272px');
				 //slide steps
        $('#fourth_step').slideUp();
        $('#fifth_step').slideDown();    
	}
    });                

// step 5				
    $('#submit_fifth').click(function(){	
	//remove classes
        $('#fifth_step input').removeClass('error').removeClass('valid');

I need to figure out the on page button code, what I need to add to the javascript file AND what I need to add in the CSS. (css is here)

Thank you SO much to whoever can help.

Browser Close Red X Button+ Popup Ok Cancel "save Or Not" +ok

Similar Tutorials

View Content

Hi ,

Kindly help

I have to handle the browser RED X close button in the window.

The problem is that its not saving the data.
before submitting/saving the data it executes the window.close()
I put settime out and form on submit conditionalyy put
even its not saving the data
But window is closing.
how can we sequentiate the save + window.close()

im copying the code below.
============
window.onbeforeunload = function()
{
if (window.event.clientY < 0 && (window.event.clientX > (document.documentElement.clientWidth - 5) || window.event.clientX < 15))
{
editedCheck();
document.BuildRequestForm.buttonClicked.value="REDX";
if( document.BuildRequestForm.measdatachanged.value=="false")
{
setVarZero();
fn_Close();
}
else
{
if(confirm('Do you want to save the changes?'))
{
elmtForm.onsubmit = fn_Close;
//document.BuildRequestForm.onsubmit=fn_Close;
//setVarZero()
saveMeasurement(); setTimeout('setVarZero()',1000);
//window.setTimeout(function() { window.close();}, 1000);
//window.setTimeout(function() { fn_Close();}, 1000);
//fn_Close();
//return true;
}
else
{ return "If you want to close the window click - Leave Page";}

}

}

}

=============
browser close RED X button+ popup OK Cancel "save or not" +OK