diff --git a/packages/form-core/src/FieldApi.ts b/packages/form-core/src/FieldApi.ts index 337b38d8a..677dc51e1 100644 --- a/packages/form-core/src/FieldApi.ts +++ b/packages/form-core/src/FieldApi.ts @@ -302,6 +302,8 @@ export interface FieldOptions< * An optional object with default metadata for the field. */ defaultMeta?: Partial + + transformOnSubmit?: (value: TData) => unknown } /** diff --git a/packages/form-core/src/FormApi.ts b/packages/form-core/src/FormApi.ts index 017735b07..dfd55dca2 100644 --- a/packages/form-core/src/FormApi.ts +++ b/packages/form-core/src/FormApi.ts @@ -516,6 +516,26 @@ export class FormApi< ) } + applyFieldsTransformation = () => { + this.store.batch(() => { + void ( + Object.values(this.fieldInfo) as FieldInfo[] + ).forEach((field) => { + if (!field.instance) return + const fieldInstance = field.instance + + // Apply transformation + const transformOnSubmit = fieldInstance.options.transformOnSubmit + if (!transformOnSubmit) return + + const transformedValue = transformOnSubmit(field.instance.getValue()) + if (!transformedValue) return + + fieldInstance.setValue(transformedValue) + }) + }) + } + /** * Validates all fields in the form using the correct handlers for a given validation type. */ @@ -810,6 +830,9 @@ export class FormApi< } try { + // Apply transformOnSubmit function + this.applyFieldsTransformation() + // Run the submit code await this.options.onSubmit?.({ value: this.state.values, formApi: this }) diff --git a/packages/form-core/tests/FieldApi.spec.ts b/packages/form-core/tests/FieldApi.spec.ts index 56a415b19..d30a4bfbc 100644 --- a/packages/form-core/tests/FieldApi.spec.ts +++ b/packages/form-core/tests/FieldApi.spec.ts @@ -1329,4 +1329,24 @@ describe('field api', () => { 'other validation error', ) }) + + it('should apply field transformation on submit', async () => { + const form = new FormApi({ + defaultValues: { + id: '1', + }, + }) + + const field = new FieldApi({ + form, + name: 'id', + transformOnSubmit: (v) => parseInt(v), + }) + + field.mount() + + expect(field.getValue()).toBe('1') + await form.handleSubmit() + expect(field.getValue()).toBe(1) + }) })