How to use color picker in Laravel 7.x and 6.x?

May 5, 2017 | Category : Laravel 5 JQuery Plugin JQuery HTML Bootstrap Laravel PHP

As we know, today we always want to make better layout for each small point of our application like datepicker, colorpicker, sorting etc. If you need to add color code on database then you would like to use color picker instead of just give textbox. In this example you can learn how to use bootstrap color picker in laravel 5 application. Here we use bootstrap-colorpicker plugin for color picker So let's see bellow example:

your.blade.php

<!DOCTYPE html>
<html>
<head>
  <title>Laravel Bootstrap Colorpicker Example</title>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/2.5.1/css/bootstrap-colorpicker.min.css" rel="stylesheet">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/2.5.1/js/bootstrap-colorpicker.min.js"></script>  
</head>
<body>
<div class="container">
    <h1>Laravel Bootstrap Colorpicker Example</h1>
    <div id="cp2" class="input-group colorpicker colorpicker-component"> 
      <input type="text" value="#00AABB" class="form-control" /> 
      <span class="input-group-addon"><i></i></span> 
    </div>
</div>
<script type="text/javascript">
  $('.colorpicker').colorpicker();
</script>
</body>
</html>

Do you like below Tutorials ?

New Articles

Blog Categories

Random Articles