Set Cookies on Bootstrap 5.3 With Checkbox
Posted: Wed Dec 06, 2023 5:47 pm
The code is using a form and a simple disable script with the cookie check
This is the Form on HTML
This are the script we are using
The First Scripts is for disable the submit button this way we can block the funtions and they can send the message before check the box
the Second script is the cookie check and generator
This is the Form on HTML
Code: Select all
<form class="needs-validation" id="disclamer" novalidate>
<span class="disclamer">
<p><b>US Citizen or resident</b></p>
<p>I am not a U.S Citizen or resident.</p>
<p><b>Calculator Statement</b></p>
<p>I understand that the calculator statement is for estimation purposes only and does not guarantee the advertised ROI.</p>
<p><b>VLND token liquidity & chain</b></p>
<p>I understand that the VLND token will be minted to my polygon address amd will initially be illiquid</p>
</span>
<div class="form-check mb-3">
<input class="form-check-input" name='visto' id="validation" type="checkbox" value="" id="invalidCheck" required>
<label class="form-check-label" for="validation">
I have read the above.
</label>
<div class="valid-feedback">Valid.</div>
<div class="invalid-feedback">Check this checkbox to continue.</div>
</div>
<input type='submit' class='btn-confirm-disclamer mb-3' id="save" value='I understand, i’m a degen.'>
</form>Code: Select all
<script>
$(document).ready(function(){
$('#save').prop('disabled', true);
$('#validation').click(function(){
if($(this).is(':checked'))
{
$('#save').prop('disabled', false);
}
else
{
$('#save').prop('disabled', true);
}
});
});
</script>
<script type="text/javascript">
$(document).ready(function() {
var cookie = false;
var cookieContent = $('.cookie-disclaimer');
checkCookie();
if (cookie === true) {
cookieContent.hide();
}
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
var expires = "expires=" + d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i].trim();
if (c.indexOf(name) === 0) return c.substring(name.length, c.length);
}
return "";
}
function checkCookie() {
var check = getCookie("acookie");
if (check !== "") {
return cookie = true;
} else {
var myModal = new bootstrap.Modal(document.getElementById('disclamer'), {})
myModal.toggle()
}
}
$('form').submit(function () {
setCookie("acookie", "accepted", 365);
cookieContent.hide(500);
});
});
</script>the Second script is the cookie check and generator