Radio Button/input Designing in Jquery UI

Date Published: 06/05/2020 Published By: JaiSchool

You need to use Jquery UI's documentation to design a checkbox. Then apply checkboxradio() method on the form.

  • Write label and input tag in the form tag.
  • Give id attribute in the input and set its value in the for attribute of the label tag to make a relation between both of them.
  • label tag will have text content to display in the radio button.


<!DOCTYPE html>
  <title>Jquery UI Radio Button</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <script src=""></script>
  <script src=""></script>
  <link rel="stylesheet" href="" />

<form id="radio-form">
  <label for="radio1">Male</label>
  <input type="radio" name="gender" value="male" id="radio1" />

  <label for="radio2">Female</label>
  <input type="radio" name="gender" value="female" id="radio2" /><br><br>
  <input type="submit" value="Submit" />
    $("#radio-form input").checkboxradio();

Publish A Comment

Leave a Reply

Your email address will not be published. Required fields are marked *