dayhavenby Nishvault01 / FORM COMPONENTSIntegration guide ↗

FREE JQUERY COMPONENT · OFFLINE READY

A day.
Chosen well.

Give date entry a little room. A focused, fullscreen picker that respects your rules — and returns one clear date to your form.

Confirm before committingKeyboard friendly3 display locales

01 / TRY THE REAL COMPONENT

Your form. A better date field.

Loading component…
ALDER WORKSHOP Fictional integration

Made slowly.
Collected on your day.

Choose a pickup day for your finished piece. Sundays and listed studio closures are unavailable.

November 2026 – March 2027 · ISO value for your form

FORM RESULT / LOCAL PREVIEW
No form submitted yet.

No booking, request or network call is made.

02 / MAKE IT YOURS

Small rules. Clear boundaries.

Edit the first field’s window and display. Configuration changes keep valid values; a rule that would invalidate your current date is rejected without changing the form.

Display language changes the calendar labels and month names. Form values always use YYYY-MM-DD. Detailed closures and weekday rules live in the saved JSON preset.

Use it in an existing jQuery page
<link rel="stylesheet" href="styles/dayhaven.css">
<!-- Your existing jQuery, then core and plugin -->
<script src="lib/core.js"></script>
<script src="lib/dayhaven.js"></script>
<label for="date">Pickup date</label>
<input id="date" name="pickup_date" required>
<script>
  jQuery('#date').dayhaven({
    min: '2026-11-01', max: '2027-03-31',
    disabledWeekdays: [0], required: true,
    label: 'Workshop pickup date'
  });
</script>

Do not load jQuery twice. The bundled example uses jQuery 4.0.0. See the guide for all options, lifecycle methods and server validation.

One field.
A considered interaction.

Free for personal and commercial project use under the included terms. Keep the component and third-party notices with your integration. No account, paid checkout or subscription.

Use terms ↗ · Third-party notices ↗