laravel / precognition

Anticipate the outcome of a future HTTP request.
https://laravel.com/docs/precognition
MIT License
136 stars 35 forks source link

Disabling inputs prevents values being sent to server #100

Open martinbean opened 1 month ago

martinbean commented 1 month ago

Laravel Precognition Plugin Version

0.5.4

Laravel Version

10.48.22

Plugin

Alpine

Description

I like to use the Alpine version of Precognition along with “traditional” Blade templates. I’ve noticed that, if I augment a HTML form with the Alpine $form magic, and disable inputs when the form is processing, the inputs’ values aren’t sent to the server.

For example:

<form
    x-data="{
        form: $form('post', '/foo', {
            quantity: null,
        }),
    }"
>
    <fieldset x-bind:disabled="form.processing">
        <label for="quantity">Quantity:</label>
        <input name="quantity" type="number" x-model.number="quantity">
    </fieldset>
    <button type="submit" x-bind:disabled="form.processing">Add to cart</button>
</form>

Doing some digging, it seems the Precognition plugin registers a submit event handler, that sets form.processing to true. When this happens, my <fieldset> elements (and any inputs contained within) are disabled, and therefore their values aren’t sent along with the form submission (I want the form to be submitted server-side rather than asynchronously using the form.submit method from Precognition).

I think the solution to this may be to set form.processing to true on next tick instead. That way, the “native” submission will happen, and the inputs would be disabled immediately after.

Steps To Reproduce

As above.

timacdonald commented 1 week ago

Thanks for reporting this, @martinbean. Gonna dig into this and get it addressed for ya.