wface

wface copied to clipboard

WDatePicker ve WDateTimePicker'da manuel olarak degisiklik yaptigimizda hatali tarihler kirmizi olarak gorunmuyor. Validation otomatik olarak yapilamiyor ve bu sebple de tarihin hatali oldugu anlasilmiyor.

Pickerlar üzerindeki maxDate ve minDate sadece dialoglarla girilebilecek aralığı belirlemek için var. Formlarda bunun için validation kullanılabilir.

<WForm
          initialValues={{ date: new Date() }}
          onSubmit={(values) => console.log(values)}
          validationSchema={WFormValidation.object().shape({
            date: WFormValidation.date().required()
              .max(new Date(2023, 0, 1), "Bulunduğunuz yılın içinde bir tarih seçmelisiniz")
              .min(new Date(2023, 11, 31), "Bulunduğunuz yılın içinde bir tarih seçmelisiniz")
          })}
        >

          <WFormField.DatePicker
            name="date"
            label="Date"
          />
          <WFormField.Submit variant="contained">Submit</WFormField.Submit>
        </WForm>

Selamlar, 1-> min- max date'te yil manuel olarak textfield'da degistirilip sonra calender butonuna tiklanip yeniden bosluga tiklandiginda yil gunumuz yilina donuyor. 2->iki datetime picker oldudugunu farzedelim formfield icinde. birisi start digeri end olacak. birbirlerinin min ve max degerlerini tasiyorlar. ben end date'te yili degistirdigimde startdate icindeki maxDate alani son renderi yapamiyor. yil 0202 seklinde kaliyor. Halbuki 2027 seklinde yeniden render olmaliydi.

` const [dateNull, setDateNull] = useState({date:new Date(),date2:new Date()}); const onChangeForm = (value:any)=>{ console.log(value); setDateNull({...dateNull,...value}) } useEffect(() => { console.log(dateNull) }, [dateNull])

return ( <WGrid container spacing={1}> <WForm initialValues={ dateNull} onSubmit={(values) => console.log(values)} onChange={onChangeForm} enableReinitialize={true} validationSchema={WFormValidation.object().shape({ date: WFormValidation.date().required() .max(dateNull.date2, max:${dateNull.date2}), // .min(new Date(2023, 11, 31), "Bulunduğunuz yılın içinde bir tarih seçmelisiniz"), date2: WFormValidation.date().required() // .max(new Date(2023, 0, 1), "Bulunduğunuz yılın içinde bir tarih seçmelisiniz") .min(dateNull.date, min:${dateNull.date}) })} >

      <WFormField.DateTimePicker
        name="date"
        label="Date"
        maxDate={dateNull.date2}
      />
      <WFormField.DateTimePicker
        name="date2"
        label="Date2"
        minDate={dateNull.date}
      />
      <WFormField.Submit variant="contained">Submit</WFormField.Submit>
    </WForm>
</WGrid>

);`