spudly1987 Posted March 26, 2014 Share Posted March 26, 2014 Hey guys, need some minor assistance again. It should be simple i got some of the code working however confused on the rest. The concept I am trying to accomplish is that when they click on the "checkbox" to agree to the terms and then click on "continue to site" it will let them in, to which I do have that working properly. However, what I would like to have done is, if they don't click on the "checkbox" and try to click "continue to site" it will come up to a page saying "you have not agreed to terms" and i'm not sure If i have to create an additional page just for that line of text to call for that option. the third thing is yes this is a semi adult content site. so I'm not sure if it would be better to have it be where people would have to enter their birth day in as well on that page as a double verification if so wouldn't know where to start on that, but I would like to focus right now on the main issue. <!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" /> <link rel="stylesheet" type="text/css" href="practice.css" /> <script type="text/javascript"> function enable(){ if(document.getElementById('opt-in-checkbox').checked = false){ document.getElementById('wpsp-continue').disabled = true; }else{ document.getElementById('wpsp-continue').disabled = false; document.getElementById('opt-in-checkbox').checked = true; } } </script> <title>Untitled Document</title> </head> <div id="wpsp-container"> <h1 id="wpsp-title"></h1> <div id="wpsp-reject">You don't agree with the terms and conditions.</div> <div id="wpsp-text">You are about to enter a website that may contain content of an adult nature. These pages are designed for ADULTS ONLY and may include pictures and materials that some viewers may find offensive. If you are under the age of 18, if such material offends you, or if it is illegal to view such material in your community, please click away from this site now.</div> <form method="post"> <span id="wpsp-opt-in"> <input id="opt-in-checkbox" type="checkbox" onclick="enable();" name="opt-in-checkbox" /></input> <label for="opt-in-checkbox">I agree with the terms stated above.</label> </span> <input id="wpsp-continue" type="submit" value="Continue to Web Site" formaction="index.html" disabled/></input> </form> </div> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/ Share on other sites More sharing options...
possien Posted March 27, 2014 Share Posted March 27, 2014 Why not have the "Continue" button dependent on the "Agree to terms" button. If they agree, then the continue button is shown else nothing. Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/#findComment-1474043 Share on other sites More sharing options...
spudly1987 Posted March 27, 2014 Author Share Posted March 27, 2014 Not exactly sure on how to write the code for that, or did i know that could be done Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/#findComment-1474045 Share on other sites More sharing options...
possien Posted March 27, 2014 Share Posted March 27, 2014 Create a function to allow them to continue on to the site or page you want. On your "Agree to Terms" put a button like this: <button type="button" onclick="enable()">I agree to the Terms</button> Then the enable() function would have code to either hide the terms and hide the agree button something like: var continue = "<button type=\"button\" onclick=\"goToSite()\">Proceed to Site</button>"; document.getElementById("id="wpsp-text").innerHTML=continue; Then in the goToSite() function you can either redirect to a URL using javascript or whatever you like. Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/#findComment-1474048 Share on other sites More sharing options...
spudly1987 Posted March 27, 2014 Author Share Posted March 27, 2014 I'm not sure I'm doing it right, I keep trying to correct it but every time its giving me errors, when trying to type the code out. Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/#findComment-1474073 Share on other sites More sharing options...
possien Posted March 27, 2014 Share Posted March 27, 2014 (edited) Sorry, a couple of typos. What I was trying to do is when they click the first button, the text and first button is replaced by a second button. The second button references a second function to do what you want. You can display a nav menu or redirect them to a start page or what ever. Again, you can replace the proceed button with a nav menu or other html. This code works: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> function enable(){ var next = '<button type=\"button\" onclick=\"goToSite()\">Proceed to Site</button>'; document.getElementById("wpsp-text").innerHTML=next; } function goToSite(){ //code to go or do something when they click the Proceed to Site button; } </script> </head> <body> <div id="wpsp-text"> You are about to enter a website that may contain content of an adult nature. These pages are designed for ADULTS ONLY and may include pictures and materials that some viewers may find offensive. If you are under the age of 18, if such material offends you, or if it is illegal to view such material in your community, please click away from this site now.<br> <button type="button" onclick="enable()">I agree to the Terms</button> </div> </body> </html> You can use css to dress it up. You could also use Jquery which to me is a little easier. You can use Jquery to create a dialog box. You could also use alert boxes, etc. Edited March 27, 2014 by possien Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/#findComment-1474154 Share on other sites More sharing options...
possien Posted March 27, 2014 Share Posted March 27, 2014 You could also use this instead without a second function: <script type="text/javascript"> function enable(){ var Path = window.location.pathname; var Page = "somepage.html"//where you want them to go; message = "Proceed to Site"; if(confirm(message)) location.href = Page ; } </script> Quote Link to comment https://forums.phpfreaks.com/topic/287307-clicking-on-buttons-to-call-an-action/#findComment-1474184 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.