check box enable button

Question

austin-khoi 0 Newbie Poster

16 Years Ago

i can't do this form, the button will be disabled when page load and only be enabled when one tick in the checkbox ( if the checkbox is unticked , the button will be disabled again). anyone help me ? thanks

php

5 Contributors
13 Replies
761 Views
1 Year Discussion Span
Latest Post 14 Years Ago Latest Post by Dasjetta

Recommended Answers

Answered by nav33n 472 in a post from 16 Years Ago

<html>
<head>
<script type="text/javascript">
function enableButton() {
	if(document.getElementById('option').checked){
		document.getElementById('edit').disabled='';
	} else {
		document.getElementById('edit').disabled='true';
	}
}
</script>
 </head>
<body onload="enableButton();">
<form method="post" action="test5.php">
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">Enable<br>
<input type="button" name="button" value="Edit" id="edit">
</form>
</body>
</html>

Cheers,
Naveen

Jump to Post

Answered by nav33n 472 in a post from 14 Years Ago

Hi! Welcome to Daniweb.. Is this what you want ?

<html>
<head>
<script type="text/javascript">
function enableButton() {
	if(document.getElementById('option').checked){
		document.getElementById('b1').disabled='';
	} else {
		document.getElementById('b1').disabled='true';
	}
}
</script>
</head>
<body onload="enableButton();">
<form method="post">
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">Enable<br>
<input type="button" name="b1" value="Click" id="b1" onclick=location.replace('

Jump to Post

Answered by almostbob 866 in a post from 14 Years Ago

<input type="button" name="b1" value="Click" id="b1" onclick="top.location.replace('http://www.google.com');" />

Jump to Post

Answered by almostbob 866 in a post from 14 Years Ago

<script type="text/javascript">
function enableButton() {
 if(document.getElementById('option').checked='checked'){  document.getElementById('b1').disabled=""; }
 else { document.getElementById('b1').disabled='disabled'; }
 }
</script>
<p style='text-align:center;'>
<span style='float:right;text-align:right;'>
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">
<label for='option'>
I have read and agree to the<br />terms and conditions
</label>
</span>
<input type="button" name="b1" value="Click" id="b1" disabled='disabled' onclick="top.location.replace('

Jump to Post

All 13 Replies

nav33n 472 Purple hazed!

16 Years Ago

<html>
<head>
<script type="text/javascript">
function enableButton() {
	if(document.getElementById('option').checked){
		document.getElementById('edit').disabled='';
	} else {
		document.getElementById('edit').disabled='true';
	}
}
</script>
 </head>
<body onload="enableButton();">
<form method="post" action="test5.php">
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">Enable<br>
<input type="button" name="button" value="Edit" id="edit">
</form>
</body>
</html>

Cheers,
Naveen

nav33n 472 Purple hazed!

14 Years Ago

Hi! Welcome to Daniweb.. Is this what you want ?

<html>
<head>
<script type="text/javascript">
function enableButton() {
	if(document.getElementById('option').checked){
		document.getElementById('b1').disabled='';
	} else {
		document.getElementById('b1').disabled='true';
	}
}
</script>
</head>
<body onload="enableButton();">
<form method="post">
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">Enable<br>
<input type="button" name="b1" value="Click" id="b1" onclick=location.replace('http://www.google.com') />
</form>
</body>
</html>

darkagn commented: Excellent suggestion. +6

almostbob 866 Retired: passive income ROCKS

14 Years Ago

<input type="button" name="b1" value="Click" id="b1" onclick="top.location.replace('http://www.google.com');" />

Edited 14 Years Ago by almostbob because: n/a

almostbob 866 Retired: passive income ROCKS

14 Years Ago

<script type="text/javascript">
function enableButton() {
 if(document.getElementById('option').checked='checked'){  document.getElementById('b1').disabled=""; }
 else { document.getElementById('b1').disabled='disabled'; }
 }
</script>
<p style='text-align:center;'>
<span style='float:right;text-align:right;'>
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">
<label for='option'>
I have read and agree to the<br />terms and conditions
</label>
</span>
<input type="button" name="b1" value="Click" id="b1" disabled='disabled' onclick="top.location.replace('http://www.google.com');" />
</p>

Edited 14 Years Ago by almostbob because: n/a

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Mahesh_J 0 Newbie Poster · Answer 1 · 2009-06-22T18:30:02+00:00

Mahesh_J 0 Newbie Poster

14 Years Ago

ok, its good

Dasjetta 0 Newbie Poster · Answer 2 · 2009-09-14T08:13:25+00:00

<html>
<head>
<script type="text/javascript">
function enableButton() {
	if(document.getElementById('option').checked){
		document.getElementById('edit').disabled='';
	} else {
		document.getElementById('edit').disabled='true';
	}
}
</script>
 </head>
<body onload="enableButton();">
<form method="post" action="test5.php">
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">Enable<br>
<input type="button" name="button" value="Edit" id="edit">
</form>
</body>
</html>

Cheers,
Naveen

Hi,

I'm new to this site and I know absolutely nothing about writing script of any kind. I am building a website using iWeb and I need to to be able to create a button on my webpage exactly like the one above. How do I make the button click go to a URL? For example I want this button to activate when the check mark is added and then when the actual button is clicked I want it to take my visitor to a link of my choice.

Thank you....

Jay

Dasjetta 0 Newbie Poster · Answer 3 · 2009-09-15T02:16:23+00:00

Hi! Welcome to Daniweb.. Is this what you want ?

<html>
<head>
<script type="text/javascript">
function enableButton() {
	if(document.getElementById('option').checked){
		document.getElementById('b1').disabled='';
	} else {
		document.getElementById('b1').disabled='true';
	}
}
</script>
</head>
<body onload="enableButton();">
<form method="post">
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">Enable<br>
<input type="button" name="b1" value="Click" id="b1" onclick=location.replace('http://www.google.com') />
</form>
</body>
</html>

We are getting close. When I put this code in my site and run it from the webpage it doesn't work properly. What happens is it opens google.com in a very tiny window where the "Click" button was. I don't want a pop up window but rather have it load google.com full size in the current window.

I would also like to be able to format it a little. I want to be able to place the check box on the right and be able to either center the "Click" button or position it on the left.

Thank you so much for the help....

Jay

Dasjetta 0 Newbie Poster · Answer 4 · 2009-09-16T02:18:04+00:00

I don't know if this makes a difference but I'm inserting the code as a Widget in iWeb 09. I think it sees the automatically generated frame of the Widget as the boundary when opening up the URL upon the button click. Can we work around this?

nav33n 472 Purple hazed! Team Colleague Featured Poster · Answer 5 · 2009-09-16T09:51:05+00:00

We are getting close. When I put this code in my site and run it from the webpage it doesn't work properly. What happens is it opens google.com in a very tiny window where the "Click" button was. I don't want a pop up window but rather have it load google.com full size in the current window.

I don't know if this makes a difference but I'm inserting the code as a Widget in iWeb 09.

It works as it is. I haven't used iweb09, so I don't have the slightest clue :(
If you post your relevant code, maybe someone who has experience on iweb 09 can help you out!

Dasjetta 0 Newbie Poster · Answer 6 · 2009-09-16T16:18:41+00:00

<input type="button" name="b1" value="Click" id="b1" onclick="top.location.replace('http://www.google.com');" />

Thank you :) That did the trick. Is there any way to format this within the Widget window? For instance I want to be able to center the button and put the check box to the right side in the box.

Also, it is possible to make a description word such as ENABLE for the check box to be a hyper link?

My intent for this little gem is to use it as a way to verify that a customer has read and agrees to my legal terms and condition before being able to order the product. The hyperlink will take then to the terms and conditions page.

To see an example of this code in use see my page http://www.holiday-scooters.com/HSR/Wheelchair_Info.html

Dasjetta 0 Newbie Poster · Answer 7 · 2009-09-17T05:23:26+00:00

Thanks guys for all the help. I was able to take cues from both of you to get what I wanted. I couldn't have done this without you. :) To see it in action go to http://www.holiday-scooters.com/HSR/Wheelchair_Info.html

Now for one last question. Is it possible to add a "BACK" button to the left of the "ORDER" button to serve as a browser back button? It would make my site look better.

<script type="text/javascript">
function enableButton() {
    if(document.getElementById('option').checked){
        document.getElementById('b1').disabled='';
    } else {
        document.getElementById('b1').disabled='true';
    }
}
</script>
<font size=-1 face="Verdana">
<p style='text-align:center;'>
<span style='float:left;text-align:right;'>
<input type="checkbox" name="option"  id="option" onclick="javascript:enableButton();">
<label for='option'>I have read and agree to the<br />
</label>
</span>
<center><a href="http://www.holiday-scooters.com/HSR/Reservations.html">Terms & Conditions</a><br />
<br>
<input type="button" name="b1" value="ORDER" id="b1" disabled='disabled' onclick="top.location.replace('http://www.holiday-scooters.com/HSR/Booking_Agent.html');" />
<br />
</font>
</p>

almostbob 866 Retired: passive income ROCKS · Answer 8 · 2009-09-17T08:09:59+00:00

<input type='button' id='back' value='back' onclick='javascript: history.go(-1);' />

Dasjetta 0 Newbie Poster · Answer 9 · 2009-09-17T08:23:24+00:00

<input type='button' id='back' value='back' onclick='javascript: history.go(-1);' />

You guys ROCK! This is freaking awesome :)

check box enable button

Recommended Answers Collapse Answers

All 13 Replies

Recommended Answers