alpine-ajax icon indicating copy to clipboard operation
alpine-ajax copied to clipboard

ajax:error event creates additional non AJAX request

Open nkev opened this issue 9 months ago • 2 comments

Hello.

I am using theajax:error event as a generic global server error handler, like this:

document.addEventListener('ajax:error', (e) => {
    alert( e.detail.statusText + ' ' + e.detail.raw); //TODO: make nicer modal popup
    e.preventDefault();
    e.stopPropagation();
    return false;
});

So if there is an AlpineAJAX error, e.g. Target [#editor] was not found in response with status [406]. this handler function is triggered in the browser.

All good so far.

But as you can see, whatever measure I take at the end of this error handler, I cannot stop Alpine AJAX re-sending the request as a non-AJAX request.

So now I have an Alpine AJAX only server endpoint that is receiving an additional non-AJAX request causing server complexity. The second non-AJAX request is coming from line 132 of alpine-ajax.js (see 5th last line in code below).

I'm wondering what the purpose is of the line window.location.href = link.href;

      let action = link.getAttribute("href");
      try {
        return await send(control, action);
      } catch (error) {
        if (error.name === "RenderError") {
          console.warn(error.message);
          window.location.href = link.href;
          return;
        }
        throw error;
      }

I don't think AlpineAJAX should force a page load on an AJAX-only end point. Maybe make it an option...

Thank you for this amazing library.

nkev avatar Feb 22 '25 06:02 nkev