Inviare la form senza ricaricare la pagina ajax e jquery

Ciao, ho un file php nel quale ho una form di ricerca all'interno del database. La form è contenuta all'interno di un collapse bootstrap. Ovviamente quando invio la form, poiché la pagina si ricarica, il collapse mi si chiude e per vedere i risultati della ricerca devo riaprirlo. Per questo volevo usare ajax per fare in modo che all'invio della form la pagina non viene ricaricata.
Ho provato diversi tentativi ma ancora non riesco a trovare una soluzione corretta.
Il file php contiene:

<script>
    $(document).ready(function(){

      $('button').on('click', function(e){
        e.preventDefault();

        if($(this).hasClass("disabled")) {
          return false;
        }
        else {
          parola = $(this).val();

          $.ajax({
            //Dove devo inviare i dati recuperati dal form?
            url: "php/cercaISBN.php",

            //imposto il tipo di invio dati (GET O POST)
            type: "POST",

            //Quali dati devo inviare?
            data: { "isbn": $("#search-input").val() }
          })
        }
      })
    });
    </script>
   <div class="text-center" id="bott">
   <p>
   <button class="bottone-isbn btn-lg btn-info" type="button" data-toggle="collapse" data-target="#demo1" aria-expanded="false" aria-controls="demo1">
    ISBN
  </button>
</p>
</div>
<div class="collapse" id="demo1">
    <br>
    <br>
   <div class="card card-body">
      <ul>
         <h1><li>ISBN: </li></h1> 
            <br>
            <br>
            <div class="container" id="cerca">
               <div class="search-container"> 

                  <form name="search-form" id="formISBN">
                        <input id="search-input" size="40" type="text" placeholder="Inserisci ISBN..." name="isbn">
                        <button name="invio" id="search-button" type="submit"><i class="fas fa-check" style="color:white;"></i></button>   
                  </form>

               </div>
            </div>
         <h1 class="text-center">Libri trovati:</h1>
            <br>
       </ul>
   </div>
</div>

E ho il file cercaISBN.php nel quale dovrei mandare l'input della form di ricerca inserito dall'utente:

<?php
session_start();

   $db = mysqli_connect('localhost','root','','DBsito');
   if (!$db) {
      die('Could not connect to database: ' . mysqli_error());
   }

   $db_select = mysqli_select_db($db, 'DBsito');

   $isbn = $_POST['isbn'];

    $query="SELECT * FROM libri_DB WHERE libri_DB.isbn = '$isbn'";

                  
    $result=mysqli_query($db, $query);
    $result_check=mysqli_num_rows($result);
    if ($result_check > 0) {
        for ($i=1; $i <= $result_check; $i++) {
            $row=mysqli_fetch_assoc($result);
            $libro=$row["nome"];

            //layout ricerca
            $risultato='
                <div class="container"> <!--container singolo libro -->

                    <!-- riga 1 -->
                    <div class="row mb-5 mb-lg-0 mt-5" id="libro">

                        <!-- tabella di una sola riga e due colonne -->
                        <div class="column"> <!-- colonna con immagine -->
                            <img class="card-img" src="img/libri/'.$row["immagine_libro"].'" alt=""/>
                        </div>

                        <div class="column"> <!-- colonna con info --> 
                            <div class="card-body">
                                <h2 class="card-title text-white ml-4 mt-3 mb-3">'.$row["nome"].'</h2>
                            </div>
                            <div class="card-body" id="descrizione"> <!-- lista caratteristiche -->
                                <ul id="dati-libro">
                                    <li class="card-text text-white"><u>Autore:</u> '.$row["autore"].'</li>
                                    <li class="card-text text-white"><u>Anno pubblicazione:</u> '.$row["data_pubblicazione"].'</li>
                                    <li class="card-text text-white"><u>Casa editrice:</u> '.$row["editore"].'</li>
                                    <li class="card-text text-white"><u>Numero di pagine:</u> '.$row["pagine"].'</li>
                                    <li class="card-text text-white"><u>ISBN:</u> '.$row["isbn"].'</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>';
                print $risultato;
        }
    }
    mysqli_close($db);
?>

Inizialmente avevo inserito questo file cercaISBN.php direttamente all'interno del primo file, ed il tutto funzionava correttamente ma avevo il problema che la pagina all'invio della form viene ricaricata. Inserendo lo script con jquery e ajax ho aggiunto questo file esterno cercaISBN.php, perché se lo lascio all'interno del primo file, non so come trattare il tutto con ajax (perché tramite

url: "php/cercaISBN.php"

gli dico dove voglio inviare i dati ricevuti tramite form).
Ora il mio problema è che in questo modo la form di ricerca non mi funziona e non funziona nemmeno lo script che ho scritto.
Qualcuno può aiutarmi?