Just add: .modal-content { height:250px; overflow:auto; } The height can of course be adapted to your personal needs. Working Example Update: It’s actually pretty easy. Just add: .modal-body { max-height: calc(100vh – 212px); overflow-y: auto; } to your css. It uses vh and calc, which also happen to have a good browser support (IE9+). This … Read more
I think the answer may be easier to understand like this: $(‘#empid’).on(‘click’,function() { alert($(this).val()); console.log($(this).val()); }); <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js”></script> <select id=”empid” name=”empname” multiple=”multiple”> <option value=”0″>item0</option> <option value=”1″>item1</option> <option value=”2″>item2</option> <option value=”3″>item3</option> <option value=”4″>item4</option> </select> <br /> Hold CTRL / CMD for selecting multiple fields If you select “item1” and “item2” in the list, the output will … Read more
You can use this JavaScript\jQuery code: // Sets active link in Bootstrap menu // Add this code in a central place used\shared by all pages // like your _Layout.cshtml in ASP.NET MVC for example $(‘a[href=”‘ + this.location.pathname + ‘”]’).parents(‘li,ul’).addClass(‘active’); It’ll set the <a>‘s parent <li> and the <li>‘s parent <ul> as active. A simple solution … Read more
Give zero to mindate and it’ll disabale past dates. $( “#datepicker” ).datepicker({ minDate: 0}); here is a Live fiddle working example http://jsfiddle.net/mayooresan/ZL2Bc/ The official documentation is available here
You can disable the second validation and make it enabled only when the first is wrong : take a look at this link <form id=”profileForm” method=”post”> <p>Please provide one of these information:</p> <div class=”form-group”> <label class=”control-label”>Social Security Number</label> <input type=”text” class=”form-control” name=”ssn” /> </div> <div class=”form-group text-center”>— Or —</div> <div class=”form-group”> <label class=”control-label”>Driver’s License Number</label> … Read more
This is because of HTML link rewriting of Angular, explained here. To prevent rewriting of location, add target=_self to those bootstrap links. So instead of <a href=”#myModal”> you need <a href=”#myModal” target=”_self”>
If you use bootstrap and you need to change checkbox background color, just override these styles: .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before { background-color: green!important; } .custom-checkbox .custom-control-input:checked:focus ~ .custom-control-label::before { box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 255, 0, 0.25) } .custom-checkbox .custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 1px #fff, … Read more
In Bootstrap 4, you could use stretched-link class, that won’t change the color of the text in the card too. Source: https://getbootstrap.com/docs/4.3/utilities/stretched-link/#identifying-the-containing-block Example: <div class=”card” style=”width: 18rem;”> <img src=”https://stackoverflow.com/questions/54404865/…” class=”card-img-top” alt=”https://stackoverflow.com/questions/54404865/…”> <div class=”card-body”> <h5 class=”card-title”>Card with stretched link</h5> <p class=”card-text”>Some quick example text to build on the card title and make up the bulk of … Read more