There are many examples of this code that don't have the radio button actually selected.
Here is the code that does so:
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Bootstrap: Collapse panel with radio buttons</title>
<link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h2>Bootstrap: Collapse panel with radio buttons</h2>
<i>A simple method to collapse and expand a Bootstrap collapsable panel using radio buttons</i>
<div class="container">
<div class="row">
<div class="col-xs-12">
<span>Display panel: </span>
<input name="collapseGroup" type="radio" data-toggle="collapse" data-target="#collapseOne"/> Yes
<input name="collapseGroup" type="radio" data-toggle="collapse" data-target="#collapseOne" checked/> No
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
Header
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse">
<div class="panel-body">
<p>Content</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js'></script>
</body>
</html>
No comments:
Post a Comment