Run ยป
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> </head> <body> <div class="col-md-12 form"> <div class="title">Hobbies</div> <div class="form-item"> <input type="checkbox" name="hobbies" id="checkbox-1" value="Films" class="custom" /> <label for="checkbox-1">Films</label> <input type="checkbox" name="hobbies" id="checkbox-2" value="Travle" class="custom" /> <label for="checkbox-2">Travle</label> <input type="checkbox" name="hobbies" id="checkbox-3" value="Restaurant" class="custom" /> <label for="checkbox-3">Restaurant</label> <input type="checkbox" name="hobbies" id="checkbox-4" value="Other" class="custom" /> <label for="checkbox-4">Other</label> </div> </div> <br/> <button id="btnSubmit" type="button">Submit</button> <script> $("#btnSubmit").click(function(){ var checkbox = $('.form .form-item input[name=hobbies]:checked'); if(checkbox == null || checkbox.length <= 0){ alert("Please select hobbies"); return; } var vals =""; checkbox.each(function(){ var values = this.value; vals += values + ", " }); alert(vals); }); </script> </body> </html