TYPO3 v11.5 - how to do frontend AJAX request

TYPO3 Questions
1

Hi all,

I am new to TYPO3 world and would appreciate your help.

At the moment I am trying to do a list of items with action buttons for each item. Buttons are edit and delete. There is also a create button on the page so user will be able to add new item in the list.
The results should be given in the same page, so I need AJAX or some kind of response that won’t refresh my page but will write in the list, either new item or will edit existing item or will remove deleted one from the list .

As far as I searched I found out that there are frontend and backend ajax.
Frontend ajax can be called either via eID or pageNum, but for newer versions of TYPO3 it is made through Middlewares.

Can someone please explain how to do it with Middlewares, or any other…

I need to get to the controller and to do some magic with db and to return response to the page without refreshing it.

Thank you!

Cheers,
Ivona

2

For fronted Ajax you have lot of options.

The most common is to create some extbase controller where some actions return JSON. You need to use rhe PropagateResponseException to make your response the main response of TYPO3 instead of the whole page rendering.

The 2nd most common is via a Middleware. Middleware are better suited for early responses as you can deside where in the stack you want your middle where to come.
So you don’t need to initalize the whole fronted stack. Middlewares are great.

And as you already found out there is eID this was the first (and still supported) early entry point. But you might have to initalize parts of the system yourself as its implemented as an early Middleware you cant decide how much of the system should be initalized be for your script is called

1 Like
3

Hey Ivona,

all you need is:

  1. A javascript which is firing a request to a specific url
  2. A middleware fetching this fired request and giving a result

The official documentation of TYPO3 middlewares you can find here:
https://docs.typo3.org/m/typo3/reference-coreapi/main/en-us/ApiOverview/RequestLifeCycle/Middlewares.html

At the bottom of the document you can find an example.
If you have any issues don’t hesitate to ask specific problems with your issue.

1 Like
4

I need some more info… documentation doesn’t help… not totally…

Do I call button on click, and then put $.ajax in?

I made initialization in RequestMiddlewares.php
made class under my_ext/Classes/Middleware/MyAjaxClass.php

And got lost how do I connect js and middleware.

Could you briefly give me the idea of what I need to do?

TYPO3 is my new world, and ajax was never my thing… so now I am trying to understand it both.

5

Ok, I solved it! :smiling_face_with_three_hearts:

I will put the link that helped me to understand Middlewares and how all things work.

Also, I used fetch API for fetching the response.

1 Like