How to use color picker?

Question

On click of a button a color picker has to open and on choosing a color from the picker a textbox should be filled with selected color.

Rajanikant Hawaldar · Answer

Hi Akshaya     private void button1_Click(object sender, System.EventArgs e) { ColorDialog MyDialog = new ColorDialog(); // Keeps the user from selecting a custom color. MyDialog.AllowFullOpen = false ; // Allows the user to get help. (The default is false.) MyDialog.ShowHelp = true ; // Sets the initial color select to the current text color. MyDialog.Color = textBox1.ForeColor ; // Update the text box color if the user clicks OK if (MyDialog.ShowDialog() == DialogResult.OK) textBox1.Background= MyDialog.Color; }

Answer

You can use html5 element. It provide default date picker functionality like :

Rajesh Gami · Answer

Hello refer this site: https://bootsnipp.com/tags/datepicker "//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css"  rel= "stylesheet"  id= "bootstrap-css" >   "//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js" >    "//code.jquery.com/jquery-1.11.1.min.js" >    in  your HEAD tag ---------->   class = "container" >   class = "row" >      "stylesheet"  href= "//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css"  />   "stylesheet"  href= "//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.min.css"  />   "//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js" >    class = "form-group" >   class = "col-xs-5 date" >   class = "input-group input-append date"  id= "datePicker" >   "text"   class = "form-control"  name= "date"  />   class = "input-group-addon add-on" > class = "glyphicon glyphicon-calendar" >                $(document).ready( function () {   $( '#datePicker' )   .datepicker({   format:  'mm/dd/yyyy'    })   .on( 'changeDate' ,  function (e) {   // Revalidate the date field    $( '#eventForm' ).formValidation( 'revalidateField' ,  'date' );   });   $( '#eventForm' ).formValidation({   framework:  'bootstrap' ,   icon: {   valid:  'glyphicon glyphicon-ok' ,   invalid:  'glyphicon glyphicon-remove' ,   validating:  'glyphicon glyphicon-refresh'    },   fields: {   name: {   validators: {   notEmpty: {   message:  'The name is required'    }   }   },   date: {   validators: {   notEmpty: {   message:  'The date is required'    },   date: {   format:  'MM/DD/YYYY' ,   message:  'The date is not a valid'    }   }   }   }   });   });

Manav Pandya · Answer

Hello   For color picker i would recommend JQuery color picker which is easy to use and customize   Below is same example as you want :   1 - Color Picker with color demo thubnails    https://www.jqueryscript.net/other/Flat-HTML5-Palette-Color-Picker-For-jQuery-colorPick-js.html   2 - Other various color picker example with demo :   https://www.jqueryscript.net/tags.php?/color%20picker/   http://www.bestjquery.com/demo/jquery-color-picker/page/2/   Choose as per your requirement and you think easy to implement by you   Thanks

Laxmidhar Sahoo · Answer

p > Choose your monster's colors: p >       div >         input   type = "color"   id = "head"   name = "head"                value = "#e66465" >         label   for = "head" > Head label >    div >       div >         input   type = "color"   id = "body"   name = "body"                 value = "#f6b73c" >         label   for = "body" > Body label >    div >