inertia FormHelper transform not working

FormHelper transform not working

Open mrmonat opened this issue 2 years ago • 7 comments

Versions:

@inertiajs/inertia version: 0.11.0
@inertiajs/inertia-react version: 0.8.0

Describe the problem:

The transform function of the form helper does not work.

Steps to reproduce:

const { data, setData, transform, post } = useForm({
        status: 'default',
        foo: 'bar',
    })

function handleDraft(event) {
        event.preventDefault()
        transform(data => ({ ...data, status: 'draft' }))
        post('/test')
 }

function handleSave(event) {
        event.preventDefault()
        transform(data => ({ ...data, status: 'open' }))
        post('/test')
}

Route::post('/test', function (Request $request) {
    return dd($request->all());
});

In both cases (handleSave or handleDraft called) the result from the laravel controller is:

^ array:2 [[▼]()
  "status" => "default"
  "foo" => "bar"
]

Mar 15 '22 16:03 mrmonat

+1

i got same problem

Apr 01 '22 04:04 muh-hizbe

I tested again with react 18 instead of react 17, but the problem still remains

Apr 01 '22 08:04 mrmonat

for now i use alternatif way,

const [data, setData, reset] = useForm();
.
.
.
Inertia.post('url', {...data, custom_field: custom_value})

Apr 01 '22 11:04 muh-hizbe

Not sure if this is the same issue, but I'm having similar problems with a Rails backend. I've found that if my server responds with anything other than a success, the transform method doesn't run. This makes debugging incredibly difficult and confusing. I was hoping to be able to throw some values at my server and see what shape they arrived, then make it look the way Rails wants it to look. Instead it seems I have to build my transforms in another method and then move it over to the transform block once it's ready?

To make it even more confusing, console.log doesn't output anything from within the transform method, regardless of server response. Likewise, inspecting form data after running transform doesn't reflect the transformations, so there's no way to view the shape of your data after it's been transformed. The only way I've found is by inspecting the body of the request in the Network tab of dev tools.

It would really be great to have access to the shape of the transformed data client side before it gets sent off to the server, and even greater if the transform was applied to the request regardless of server response.