HTML Radio Button


Updated on 17 February, 2020 at 8:00 PM [IST], created by Admin, Website: codewithbishal.com


Preview :




JavaScript check if radio button is checked

What the is radio button validator?

=> Our awesome, radio button validator checks if the visitor has selected / checked any radio button or not.

How can I use this radio button validator?

=> You can easily copy the code from our website and can simply paste it anywhere.

Do I need to know how to code?

=> No, you don't need to know how to code you can simply copy code from here and paste it wherever you want your contact form. Also, you can try it on our website using the "TRY IT NOW" option, also you can download the code from below.

Is it safe to use Social media icons?

=> Yes, it's completely safe to use the radio button validator.

What are the advantages of radio button validator?

=> radio button validator is a very good way for knowing if the visitor has selected / checked / accepted the radio button.

Overview of the Blog :

=> In this blog, you can learn, how to make radio button validator using HTML and JavaScript By Code With Bishal. Just Copy The Code From Here And Paste It Into Your Website. To Preview scroll the page to the beginning. If you are having any problem viewing the code just refresh the page. radio button validator is a lightweight and easy-to-use HTML code that creates a radio button validator for you. In this blog, there are fifth sections on the webpage, in the first section, you can get a preview of the blog, in the second section there are few FAQs and an overview of the blog, in the third section there are few more coding blogs you might like, in the fourth section you can Try our radio button validator using the "TRY IT NOW" button, after that, you can copy the code and paste it [that's the fifth section]. Also there is a Download button below to download the required code.


You might like this :






Step by step guide of creating a radio button validator (If you want to make a image carousel click Here ) :

Step 1

=> Add the Broiler plate of HTML
 
<!DOCTYPE html>
<html>
<head>
<title>Radio button - Code With Bishal</title>
</head>
<!-- created by Code With Bishal - www.codewithbishal.com -->
<body>
</body>
</html>

Step 2)

=> Add JavaScript (External or Internal)

If you are using External JavaScript file then create a file


    app.js

And add code :


<script src="app.js">

If you want to use Internal js than add

                <script>   </script>

tag Between

                <head>   </head>

then add the js code (from below) between script tag or inside
app.js

OR copy the code from below


Step 1) Add your HTML Code -

HTML Code

<!DOCTYPE html>
<html>
<head>
<title>How to make Radio button validator using JS - Code With Bishal</title>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css">
</head>
<!-- by Code With Bishal - www.codewithbishal.com -->
<body>
<form action="#" method="POST" onsubmit="return checkcwb()">
<div class="form-check">
<input type="checkbox" class="form-check-input" name="iagree" id="agree">
<label class="form-check-label" for="agree">I accept the <a href="#">terms and conditions</a>
and <a href="#">privacy policy</a></label>
</div>
<br>
<div class="form-check">
<input type="checkbox" class="form-check-input" name="disagree" id="disagree">
<label class="form-check-label" for="disagree">I reject the <a href="#">terms and conditions</a>
    and <a href="#">privacy policy</a></label>
</div>
<br>
<input type="submit" class="btn btn-primary" value="Submit">
</form>
</body>
</html>

Step 2) Add your JavaScript Code -

JavaScript Code

<script>
function checkcwb() {
 if (document.getElementById('agree').checked == false) {
  swal ("Warning", "Please indicate that you accept the Terms and Conditions and Privacy Policy", "error");
  return false;
 } else {
  return true;
 }
}
</script>
          




Leave a Comment:

Comments:



Search