Requête AJAX sans balise form

Bonjour,

Je travaille sur projet et je me pose la question "Es ce qu il est possible de faire une requête AJAX sans balise form ?".

Je m'explique,

Je suis sur une partie de mon projet où je dois gérer une liste de favoris, mon soucis se pose lorsque je clique sur un icone, j'aimerai lancer une requête : AJAX dans le but d'ajouter un élément en favoris dans BDD.

Je vous laisse mon code pour que ce soit plus clair pour vous

View :

Code:

1
2
3
4
<div class="abcing-tool-description">
    {{ tool.presentation | raw }}
    <i id="starFavorite" class="starsFavorite no-favorite-star fa fa-star fa-3x" style="float: right;" aria-hidden="true"></i>
</div>

JS :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
stars.on('click', function(e) {
      e.preventDefault();
        var thisFav = $(this);
        console.log(thisFav);
        if (thisFav.hasClass('no-favorite-star')) {
          var isFav = false;
        } else if (thisFav.hasClass('favorite-star')) {
          var isFav = true;
        }
        console.log(isFav);
 
        if ( thisFav.hasClass('no-favorite-star')) {
           thisFav.removeClass('no-favorite-star').addClass('favorite-star');
        } else if ( thisFav.hasClass('favorite-star')) {
           thisFav.removeClass('favorite-star').addClass('no-favorite-star');
        }
 
 
         $.post({
          url: Routing.generate('add_favorite_tool'),
          data: {
            fav: isFav
          },
          success: onSuccess,
        });
      });

J'aimerai envoyer mes données en back pour les traiter mais du coup je me pose la question si je fais bonne route avec $.post