PDA

View Full Version : Accept terms script



fromthe5
03-15-2005, 08:27 PM
http://www.dynamicdrive.com/dynamicindex16/acceptterm.htm


When it comes to script I'm afraid that I am not too adept, but I need to get this "Accept terms" forms submission working. I have the script pasted into my page in both places and it shows the box where I need it to be. When it's set up correctly does clicking the submit button take you to the next page? I'm not sure what to substitute in the script. I'm lost. I can post the actual page I'm working with here if that will help. Can anyone help me out here?
Thank you.

fromthe5
03-16-2005, 12:01 AM
I might have it down to : What, exactly is "extra" code 3? and where can I find or create it?

ddadmin
03-16-2005, 06:21 AM
Hi:
The script simply disables the submit button until the user checks the checkbox. It *won't* actually submit the form at the end of the day, as that's up to your form script (ie: CGI or PHP) to handle. Check here for some PHP form submission scripts: http://hotscripts.com/PHP/Scripts_and_Programs/Form_Processors/index.html

fromthe5
03-16-2005, 02:33 PM
Ah, ok Got it. Thank you.

HerbKilby
11-12-2005, 02:24 PM
http://www.dynamicdrive.com/dynamicindex16/acceptterm.htm Accpt Terms Example:

Rather than start a new thread and complicating search for visitors, I thought I'd post this question with this topic. :)

Is it posible to carry this just one step farther to detecting if the user has at least scrolled through the terms they are accepting?

I personally just check the box and hit submit when I encounter this type of script on a website; but, it would be nice to reinforce to the visitor that I intend for them to read the terms before they accept them.

If there is an example of or discussion on this step please point me in that direction.

p.s. To the DD staff:
We do appreciate the wealth of information you share for free on this site.
Did I say free? Yes and thank you very much.

jscheuer1
11-12-2005, 09:19 PM
Here is a mod of the script that should fit the bill (works here in limited trials, see notes at the bottom of this post):


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Agree Terms (w/terms scrolled to bottom? test) - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">

//"Accept terms" form submission- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use
//Modified Here by jscheuer1 in http://www.dynamicdrive.com/forums
//to also require scrolling to the bottom of the terms.

//Set id of Terms Textarea:
var termsId='terms'
//Set Agree Form Name:
var agreeform='agreeform'
//Set Agree Form Agree Checkbox Name:
var agreecheck='agreecheck'

/////////////No Need to Edit Below/////////

var ckSc, termsH, textA, checkobj, ok=0

function agreesubmit(el){
checkobj=el
if (document.all||document.getElementById){
for (i=0;i<checkobj.form.length;i++){ //hunt down submit button
var tempobj=checkobj.form.elements[i]
if(tempobj.type.toLowerCase()=="submit"){
if(ok&&checkobj.checked)
tempobj.disabled=0
else {
if (checkobj.checked)
alert('At Least Read the Terms!')
tempobj.disabled=1
checkobj.checked=0
}
}
}
}
}

function defaultagree(el){
if (!document.all&&!document.getElementById){
if (window.checkobj&&checkobj.checked)
return true
else{
alert("Please read/accept terms to submit form")
return false
}
}
}

function checkScroll() {
if (textA.scrollTop>=termsH-10){
ok=1
clearInterval(ckSc)
}
}

function getH(){
document.forms[agreeform][agreecheck].checked=false
textA=document.all? document.all[termsId] : document.getElementById(termsId)
textA.scrollTop=0
var scT=scT1=scT2=textA.scrollTop
while (scT==scT1){
scT1+=1000
textA.scrollTop+=1000
scT=textA.scrollTop
}
textA.scrollTop=scT2
termsH=scT
ckSc=setInterval("checkScroll();",20)
}

if (document.all||document.getElementById)
onload=getH

</script>
</head>
<body>
<form name="agreeform" onSubmit="return defaultagree(this)">
<textarea id="terms" cols=50 rows=5 wrap=virtual>
DYNAMIC DRIVE SCRIPTS USAGE TERMS
1) Users may use any of the scripts found on Dynamic Drive on both personal and commercial web sites, free of charge. However, users may NOT redistribute, sell, or repost for download any of the scripts found on Dynamic Drive on any medium (CD-Rom, website, etc) without the expressed written permission of Dynamic Drive

2) Users agree not to remove the copyright notice inside each script.

3) Users agree not to use scripts found on Dynamic Drive for illegal purposes, or on pages containing illegal material.

4) Users agree not to hold Dynamic Drive liable for any damages resulted from proper or improper use of any of the scripts found on Dynamic Drive. Use at your own risk.
</textarea><br>
<input name="agreecheck" type="checkbox" onClick="agreesubmit(this)"><b>I agree to the above terms</b><br>
<input type="Submit" value="Submit!" disabled>
</form>

<script type="text/javascript">
document.forms[agreeform][agreecheck].checked=false
</script>

<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://www.dynamicdrive.com">Dynamic Drive</a></font></p>
</body>
</html>

Notes: Requires that an id be assigned to the textarea containing the terms and that this id, as well as the name of the form and the name of the agree checkbox be configured in the script. Uses onload event to determine the scroll height of the terms text area. If you have other scripts on your page that use this event, there will be conflicts

mwinter
11-13-2005, 01:12 AM
Is it posible to carry this just one step farther to detecting if the user has at least scrolled through the terms they are accepting?Why bother? They aren't any more likely to do it, it doesn't make the process any more legally binding, and you'd probably confuse more than a few people.


If there is an example of or discussion on this step please point me in that direction.Someone asked a question like this on Usenet (http://groups.google.co.uk/group/comp.lang.javascript/browse_frm/thread/ded120f45e17e6d8/4cef739aa35d39a0). You can read my response (http://groups.google.co.uk/group/comp.lang.javascript/msg/8ba55ffd6c1ef674) through the Google Groups archive.


On a separate note, this script should not use an initially disabled submit button, otherwise users with scripting disabled are left stranded.

To John: The first thing you should do is check that the control actually has a scrollTop property, otherwise you might disable the submit button and leave no (obvious) way to re-enable it. If the property isn't a number



textA = ...;
if('number' != typeof textA.scrollTop) {
ok = true;
return;
}
then abandon this part of the test entirely.

Secondly, running your check every 20ms is rather unfriendly. I wouldn't have thought that anything more frequent than at least 100ms should be necessary.

Mike

jscheuer1
11-13-2005, 02:44 AM
Good Point about the submit button, it was like that in the original. It could easily be transferred to the two parts (each in a separate script on the page, also from the original, the two parts bit) where the checkbox is set or (as the case may be) reset to unchecked, change it to:


<input type="Submit" value="Submit!">

Then add to getH():


function getH(){
for (i=0;i<document.forms[agreeform].length;i++) //hunt down submit button
var tempobj=document.forms[agreeform].elements[i]
if(tempobj.type.toLowerCase()=="submit")
tempobj.disabled=1
document.forms[agreeform][agreecheck].checked=false

Actually, we can stop there as the other scriptlet near the end of the page, as far as I can tell, is for browsers using the default onsubmit function because they are not compliant with document.all or getElementById.

Since you raise the point, the answer is probably yes but, is it likely a browser will use either document.all or document.getElementById and not see a textarea's .scrollTop as a number? I tested this in IE and FF. Worked fine. In Opera it defaulted to the behavior it had before my modifications because although Opera does see the scrollTop as a number, it doesn't take well to its being adjusted in the manner I used. Nevertheless, the while loop still sets ok=1 because the control value passes out of parity after the first pass anyway. 20ms, 100ms - there's a big difference? In any event it is a very non-resource intensive interval and is cancelled as soon as the user scrolls to the end of the textarea or (one would hope) leaves the page.

mwinter
11-15-2005, 12:04 AM
Actually, we can stop there as the other scriptlet near the end of the page, as far as I can tell, is for browsers using the default onsubmit functionDo you mean:



<script>
//change two names below to your form's names
document.forms.agreeform.agreecheck.checked=false
</script>
just after the form closing tag? I don't know what that's there. The checkbox input element doesn't have a checked attribute, so seems rather pointless.


because they are not compliant with document.all or getElementById.I have no idea why that 'check' is present, either. The presence of either of those properties has no bearing on the operation of the original script.


Since you raise the point [existance of the scrollTop property], [...] is it likely a browser will use either document.all or document.getElementById and not see a textarea's .scrollTop as a number?The matter isn't just whether the property is a number, but whether that number accurately reflects the scrolled position of the element. As you discovered, Opera is an example of a failing case. Though this can be tested by assigning to the property, that same test may not work on other browsers.


20ms, 100ms - there's a big difference?I was conservative with 100ms. I doubt that there would be anything wrong with 250ms.

As for the question, there could be on different systems. On a modern machine with a NT-based Windows OS or Linux, propably not. The timer resolution is in the order of 10ms (though timeslices are usually only 20ms). However, older operating systems have much lower resolutions, often 55ms, to trying to schedule operations more frequently than this can be a waste of time.

Whilst your code is simple and fast, I have seen many examples where intensive operations are being scheduled far too often, reducing this machine to a crawl (and it's pretty damn fast). Timers should be set to periods that are adequate for the intended purpose. Nothing more, otherwise the browser will be doing little other than trying to service that code.

Mike