JavaScript - Disable Submit Button After Onclick

Hello all,

I have 2 radio buttons
update bsc value
update mnr value

when user selects update mnr value, two more radio buttons should appear.
I have mnr value
I do not have mnr value.

On selecing I do not have mnr value im submitting the form and enabling the user to select values from dropdown. ( not shown in the code as it is a coldfusion code.).

On submit I am not able to still keep the 'but2', and 'my_select3' elements disabled.

Please advice. I have been working on this since quite sometime.

<script language="JavaScript">
function makeChoice() {
var obj1 = document.getElementById('box1')
var obj2 = document.getElementById('box2')
if (document.getElementById('but1').checked) {
obj2.setAttribute('readOnly','readonly');
obj1.removeAttribute('readOnly');
document.getElementById('but1').disabled=true;
document.getElementById('but2').disabled=true;
}
else if (document.getElementById('but2').checked) {

obj1.setAttribute('readOnly','readonly');
obj2.removeAttribute('readOnly');
document.getElementById('but2').disabled=true;
document.getElementById('but1').disabled=true;

}

}
</script>

<script type="text/javascript">
function showSelect() {

if (document.getElementById('but2').checked)
{
document.getElementById('but2').disabled=true;
}

}
</script>

<script type="text/javascript">
function showSelect1() {
if (document.getElementById('but2').checked)
{
document.myform.submit();
document.getElementById('but2').disabled=true
document.getElementById('my_select3').disabled=true
}

}
</script>


<td><input type="radio" id="but1" name="vals" onclick="makeChoice()"></td>
<td>Update BSC Value </td>

<tr>
<td><input type="radio" id="but2" name="vals" onclick="makeChoice();showSelect();" ></td>
<td>Update MNR Value </td>

<td> <input id="my_select1" class="show" type="radio" name="my_select1" onclick="this.myform['my_select1'].disabled=true"></td>

<td> I have a Position Number </td>


<td><input id="my_select3" class="show" type="radio" name="my_select3" onclick="showSelect1();"></td>

<td> I do not have a Position Number </td>

I have created some online software which uses form data to submit to another page.

The problem is that I have other submit buttons in the same form which submit to different pages (depending on which button is pressed).

The first submit button works fine but all the others only work once.
Code:

<input class="cssbutton" type='submit' value='Button1' onclick="wbform.action='page1.php'; target='mainFrame'; return true;">
<input class="cssbutton" type='submit' value='Button2' onclick="wbform.action='page2.php'; target='_blank'; return true;">

<input class="cssbutton" type='submit' value='Button3' onclick="wbform.action='page3.php'; target='topFrame'; return true;">
<input class="cssbutton" type='submit' value='Button4' onclick="wbform.action='page4.php'; target='topFrame'; return true;">

<input class="cssbutton" type='submit' value='Button5' onclick="wbform.action='page5.php'; target='_blank'; return true;">
<input class="cssbutton" type='submit' value='Button6' onclick="wbform.action='page6.php'; target='_blank'; return true;">

Any ideas my friends?

Hi, I am having a problem with my script used to disable my submit button. I want the button to disable upon correct submission of the form, and the button to be kept enabled if the required fields are not filled in. I have the following code at the moment (which only does the first if statement).

Code:

SCRIPT CODE: 

<script type="text/javascript" >
function validateForm()
{

var amount=document.forms["expenserecord"]["amount"].value;
var picker=document.forms["expenserecord"]["picker"].value;
var desc=document.forms["expenserecord"]["description"].value;

if (amount==null || amount=="" || picker==null || picker=="" || desc==null || desc=="") {
  alert("All required fields must be filled out.");
  document.getElementById("sub").disabled = false;
  return false;
}
 
else {
 	document.getElementByID("sub").disabled = true;	
}

}

</script>

BUTTON CODE:

<p><input type="submit" value="Submit" onClick="return validateForm()" id="sub"></p>

I'm trying to get a submit button to open a thank you page I created (i.e. thankyou.html) only after the user has filled out a series of questions for a form. If they don't fill out the required information, a pop up box informs them to fill out the section (this I have accomplished). I cannot get the submit button to not work if the fields are left un-answered. Can you guys help?

Thanks for you help.
--------------------------------------------------------------------------

This is what I have so far:

<title>Customer Demographic Data Form</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" ></meta>
<style type="text/css">
body {
font-family: Times New Roman;
color: navy;
background-color: #CCC
}
h1, h2, h5 { font-family: Times New Roman; color: black }
body,td,th {
color: #000;
font-family: Times New Roman, Times, serif;
}
h1 {
color: #000;
}
h2 {
color: #000;
}
h5 {
color: #000;
}
a {
font-family: Times New Roman, Times, serif;
}
h1,h2,h3,h4,h5,h6 {
font-family: Times New Roman, Times, serif;
}
</style>

<script type="text/javascript">

function checkForNumber(fieldValue) {
var numberCheck = isNaN(fieldValue);
if (numberCheck == true) {
window.alert("Please enter a numeric value!");
return false;
}
}

function confirmSubmit() {
var email = document.forms[0].email.value;
if (document.forms[0].fname.value == ""
|| document.forms[0].lname.value == "")
{
window.alert("Please enter your first and last name.");
document.forms[0].lname.focus();
return false;
}
else if (document.forms[0].address1.value == ""
&& document.forms[0].email.value == "")
{
window.alert("Please enter your Mailing Address or Email Address!");
document.forms[0].address1.focus();
return false;
}
else if (email.indexOf("@") == -1
&& document.forms[0].email.value != "")
{
window.alert("Please enter a valid e-mail address.");
document.forms[0].email.focus();
return false;
}
else if (email.indexOf(".") == -1
&& document.forms[0].email.value != "")
{
window.alert("Please enter a valid e-mail address.");
document.forms[0].email.focus();
return false;
}

else if(document.forms[0].city.value == '')
{
window.alert("Please enter your City");
document.forms[0].city.focus();
return false;
}
else if(document.forms[0].state.value == '')
{
window.alert("Please enter your State");
document.forms[0].state.focus();
return false;
}
else if(document.forms[0].zip.value == '')
{
window.alert("Please enter your Zip Code");
document.forms[0].zip.focus();
return false;
}

checkCookie()
}

function checkCookie()
{
var formInfo = decodeURI(document.cookie);
var userInfo = formInfo.split("; ");
var lname = userInfo[0].split("=");
var fname = userInfo[1].split("=");


if (lname[1] == document.forms[0].lname.value
&& fname[1] == document.forms[0].fname.value)

{
this.close(true);
window.open("FormDenied.html");
return false;

}
else
{
setCookie();
return true;
}

}

function setCookie()
{
var expiresDate = new Date();
expiresDate.setFullYear(expiresDate.getFullYear() + 1);
document.cookie = encodeURI("lname=" + document.forms[0].lname.value) + "; expires=" + expiresDate.toUTCString();
document.cookie = encodeURI("fname=" + document.forms[0].fname.value) + "; expires=" + expiresDate.toUTCString();

window.alert("Your information has been saved.");
}

</script>
</head>

<body>
<p>&nbsp;</p>
<h1 align="left" style="text-align: left">Kudler Fine Foods contact form</h1>
<form action="" method="get" enctype="application/x-www-form-urlencoded"
onsubmit="return confirmSubmit();"
onreset="return confirmReset();" >
<blockquote>
<h2><u>Name</u></h2>
<p>
<input type="text" name="fname" id="fname" size="25" />
<label for="fname"><strong>First Name</strong><br>
<br>
</label>
<input type="text" name="lname" id="lname" size="15" />
<strong>Last Name</strong></p>
<h2>---------------------------------------<br>
<u>Address</u> </h2>
<p>
<input type="text" name="address1" id="address1" size="30" />
<label for="address1"><strong>Address Line 1</strong></label>
</p>
<p>
<input type="text" name="address2" id="address2" size="20" />
<strong>Address Line 2<br>
<br>
</strong>
<input type="text" name="city" id="city" size="20" />
<strong>City</strong> </p>
<p>
<input type="text" name="state" id="state" size="2" />
<label for="state2"><strong>State</strong></label>
</p>
<p>
<input type="text" name="zip" id="zip" size="10" maxlength="10" onChange="return checkForNumber(this.value);" />
<label for="zip2"><strong>Zip Code</strong></label>
</p>
<h2>--------------------------------------- </h2>
<h2> <u>Other Information</u></h2>
<table>
<tr>
<td width=300><strong>Telephone</strong></td>
<td width=300><p><strong>Email address:</strong></p></td>
</tr>
<tr>
<td>
<input type="text" name="area" id="area" size="3" maxlength="3" onChange="return checkForNumber(this.value);" />
<input type="text" name="exchange" id="exchange" size="3" maxlength="3" onChange="return checkForNumber(this.value);" />
<input type="text" name="phone" id="phone" size="4" maxlength="4" onChange="return checkForNumber(this.value);" /></td>
<td>
<input type="text" name="email" id="email" size="30" /></td>
</tr>
</table>
</blockquote>
<h5>&nbsp;</h5>
<blockquote><blockquote>
<h3 align="center">
<input name="Submit" type="button"

</h3>
</blockquote>
</blockquote>
</form>
</body>
</html>

Below is a script I found at http://bytes.com/topic/javascript/an...cookie-problem

The idea is a like button, like on fb, in a form which updates a db field I can use to display the number of likes, and my goal is to disable the like button for the rest of the session, or a day, or whatever. This script disables it onclick, the problem is I can't figure out how to get it to submit the form as well.

I have found it does submit if the input type is 'submit', but then it doesn't call the disable function. I tried writing another function to submit the form but no go.

Code:

<html>
<head>
<title>Vote Button</title>
<script type="text/javascript">
function checkForVote()
{
    // If there is a cookie...
    if(document.cookie != "")
    {
        if(getCookie("voted") == 1)
        {
            // Disable the button again if user already voted. 
            disableButton();
        }
    }
}
 
function disableButton()
{
    var submitvote = document.getElementById("submitvote");
    submitvote.disabled = true;
    submitvote.value = "You Already Voted.";
}
 
function setCookie(name, value, days)
{
    if(days) 
    {
        var date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        var expires = "; expires = " + date.toGMTString();
    }
 
    else 
    {
        var expires = "";
    }
 
    document.cookie = name + "=" + value + expires + "; path=/";
 
    // Disable the button as soon as the user clicks it.
    disableButton();
}
 
function getCookie(name) 
{
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
 
    for(var i=0; i < ca.length; i++) 
    {
        var c = ca[i];
 
        while (c.charAt(0)==' ') 
        {
            c = c.substring(1,c.length);
        }
 
        if (c.indexOf(nameEQ) == 0) 
        {
            return c.substring(nameEQ.length,c.length);
        }
    }
 
    return null;
}
 
</script>
</head>
 
<body>
<form name="voteform" id="voteform" action="foo.php" method="post">
<input type="button" name="submitvote" id="submitvote" onclick="setCookie('voted', 1, -1);" value="Submit Vote"/>
</form>
</body>
<script type="text/javascript">
// Run checkForVote() at end of document so that form and contents can be referenced
window.onload = checkForVote();
</script>
</html>