Date Picker - Type Date

kane81

Hi,

Just some feedback re datepicker - it would be great if you can type the date - at the moment you can only select date using the calendar which is slow for users entering in past dates like DOB etc.

see here and if you click on the date - you cannot change the date by typing in a number.

https://stackblitz.com/edit/sveltejs-kit-template-default-csqvqwga?file=src%2Froutes%2FMyEditor.svelte

keep up the great work!

tasha

Hello

We do have a feature that allows users to type in dates directly. You can use editable datepicker where you can set editable property to true.
Please check th examples: https://webix.io/dev/svar/svelte-core-demos/master/#/datepicker/willow

kane81

Thanks - how do I do that from grid column? as I dont do

<DatePicker editable={true} />

const gridColumns = [{
			id: 'adCreated',
			header: 'Created',
			footer: 'Created',
			width: 140,
			resize: true,
			cell: DateTimeEditor,
			comp: 'readonly',
			template: (date: { toLocaleDateString: () => string }) =>
				date ? date.toLocaleDateString() : '',
			editor: 'datepicker'
		},]

			<Grid
				data={mydata}
				columns={gridColumns}
			/>

tasha

In the columns property of the grid you can set the editor parameter not only as a string but as an object with the config parameter where you can define editable: true:

  {
    id: "date",
    header: "Date",
    width: 100,
    editor: {
      type: "datepicker",
      config: { format: "%d/%m/%Y" },
      editable: true
    },
    template: (v) => (v ? v.toLocaleDateString() : ""),
  }

Please check the example: https://stackblitz.com/edit/sveltejs-kit-template-default-fpezy3oh?file=src%2Froutes%2FMyGrid.svelte

kane81

Thank you!

That worked well :)