Css property of date picker

Tags: #<Tag:0x00007efc61d7d3e0>
#1

Hi, I’m trying to override the css property of default date picker of handson table, but I’m not able to get it Plzz help me.

#2

Hi @guruprashanth.s

what exactly you would like to achieve?

#3

I want over write the css styles of default date picker like month name should appear in different colors, size of the calendar .
here my code

.handsontable .htDatepickerHolder .pika-single .pika-lender .pika-title .pika-label{
background-color: red !important
}

#4

Here month name august is black by default . I need to change that color.

#5

Instead of arrow icon in date I need to change calendar icon.
plz help

#6

The calendar is a Pikaday app (src: https://github.com/dbushell/Pikaday). You may want to check their docs for tips and load the new styles after handsontable.min.css in your app.

#7

ok thanks… I’ll check

#8

Hi,
Instead of default pikaday date picker, I want to use other date picker from bootstrap or my own date picker???
how can I achieve this??

#9

You’ll need to create a new cell type. Here a tutorial https://docs.handsontable.com/pro/5.0.1/tutorial-cell-types.html and it’s also good to read https://docs.handsontable.com/pro/5.0.1/tutorial-cell-function.html

#10

Hi @aleksandra_budnik My requirement is to change the pikaday date picker in to my own custom date function. or I want to modify the pikaday datepicker in to my format.

#11

If you only want to change styling you can try to use important! but for more complicated operations you need to create a cell type.

#12

important! is not working

#13

#14

Don’t mind plz, if I want to change month color to red color or different color what can I do… send me proper code to change clr plzzz help me

#15

Do you mean this (red title + blue list)

If so here is a demo http://jsfiddle.net/a26k1r34/

#16

I changed css property successfully. but I need to insert new date picker instead of pika day, how can I???
date pickers available in bootstrap I want to insert in handson table.

#17

so like i have told you you need to create a new cell type that will correspond to a new library of your choice. Our date cell type doesn’t allow you to choose from several datapickers.

1 Like
#18

ok yar thanks for ur information.:grinning:

1 Like
#19

Hii is there any in-built datetime picker is there for handson table other than pikaday.

#20

No, sorry we only use Pikaday solution.