Jak pokazać pasek postępu podczas ładowania, używając ajax

Mam listę rozwijaną. Gdy użytkownik wybierze wartość z listy rozwijanej, wykonuje zapytanie w celu pobrania danych z bazy danych i pokazuje wyniki na froncie za pomocą ajax. To zajmuje trochę czasu, więc w tym czasie chcę pokazać pasek postępu. Szukałem i znalazłem wiele samouczków na temat tworzenia pasków postępu dla przesyłania, ale nie podobało mi się żadne. Czy ktoś może mi pomóc?

Mój kod ajax:

<script>
$(function() {
    $("#client").on("change", function() {
      var clientid=$("#client").val();

        $.ajax({
            type:"post",
            url:"clientnetworkpricelist/yourfile.php",
            data:"title="+clientid,
            success:function(data){
             $("#result").html(data);
            }
        });

    });
});
</script>

questionAnswers(9)

yourAnswerToTheQuestion