Here, I will let you know very simple example of generate select box using select2 jquery plugin in laravel application. Bootstrap provide very simple drop-down box. But if you want to add search with select box then you should use select2 js plugin.
Select2 plugin provide us select drop-down box with search value and there are several feature available in select2 js. So in this example i am going to give you very basic example of select2 js.
Let's see bellow full example code:
Blade File:
<!DOCTYPE html>
<html>
<head>
<title>Laravel Select2 Example</title>
<link rel="stylesheet" href="http://demo.itsolutionstuff.com/plugin/bootstrap-3.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" />
<script src="http://demo.itsolutionstuff.com/plugin/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
</head>
<body>
<div class="container">
<h1>Laravel Select2 Example</h1>
{!! Form::open() !!}
{!! Form::select('status', ['Pending', 'Active', 'De-Active'], null, ['class' => 'form-control sel-status']) !!}
{!! Form::close() !!}
</div>
</body>
<script type="text/javascript">
$(document).ready(function() {
$(".sel-status").select2();
});
</script>
</html>
I hope you found your best solution....
Do you like below Tutorials ?
- Angular 9 HttpClient Request with RxJS Observable Example
- How to Create Routing Module in Angular 9?
- How to Create Custom Directive in Angular 9?
- Print Iframe Content using JQuery Example
- Allow Only Numeric Values in Textbox using JQuery
- Codeigniter Confirmation Box Before Delete Item Example
- How to Use Sweet Alert in Codeigniter?
- Disable F5 Key And Browser Refresh Using Javascript