jQuery UI Checkboxradio icon Option
Checkboxradio Widget icon Option is used to show the checkbox or radio icon, depending on the input’s type using jQuery UI.
Syntax:
$( ".selector" ).checkboxradio({ icon: false });
Approach: First, add jQuery UI scripts needed for your project.
<link href=”https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/cupertino/jquery-ui.css” rel=”stylesheet”>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js”></script>
<script src=”https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js”></script>
Example:
HTML
<!DOCTYPE html> < html > < head > < link href = 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/cupertino/jquery-ui.css' rel = 'stylesheet' > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" > </ script > < script src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" > </ script > </ head > < body > < center > < h1 style = "color:green" >w3wiki</ h1 > < h3 >Radio Button Example</ h3 > < label for = "radio1" >Button 1</ label > < input type = "radio" name = "radio" id = "radio1" class = 'radio' > < br > < label for = "radio2" >Button 2</ label > < input type = "radio" name = "radio" id = "radio2" class = 'radio' > < br > < label for = "radio3" >Button 3</ label > < input type = "radio" name = "radio" id = "radio3" class = 'radio' > < br >< br >< br > < h3 >Checkbox Example</ h3 > < label for = "checkbox1" >Checkbox 1</ label > < input type = "checkbox" name = "checkbox1" id = "checkbox1" class = 'checkbox' > < br > < label for = "checkbox2" >checkbox 2</ label > < input type = "checkbox" name = "checkbox2" id = "checkbox2" class = 'checkbox' > < script > $(document).ready(function () { $(".radio, .checkbox").checkboxradio({ icon: false }); }); </ script > </ center > </ body > </ html > |
Output:
Contact Us