To edit an event on Fullcalendar I click on an event, a modal apparead and is connected to a PHP file and has an AJAX call in JS. The problem is: when I open the modal and close it, even if I have made no changes it reload the page. Can someone please explain what's the problems in these code, I cant seems to find a solution and it's pretty annoying that reload without making changes.

JS call:

    $('#editNewEvent').modal('show').one('hidden.bs.modal', function (e) {
                if(event.nomeUtente == $("#nomeUtente").data('value')){
                        event.title = $('#editEname').val();
                        event.start = $('#editStarts').val();
                        event.end = $('#editEnds').val();
                        
                        $.ajax({
                            url: 'eventi/updateEvent.php',
                            type: 'POST',
                            data:  {start: event.start, _id: event.idAssenza, end: event.end, title: event.title},
                            success: function(data) {
                                    window.location.reload(true);
                            } 
                        });                             
                        $('#calendar').fullCalendar('updateEvent', event._id);
                    }
});

PHP editEvents:

require_once "../config.php";
  session_start(); 
   
    
    $id =           $_POST['_id'];
    $ename =        $_POST['title'];
    $starts =       $_POST['start'];
    $ends =         $_POST['end'];
    $nomeUtente =   $_SESSION['nomeUtente'];        

     // update the records
    $sql = "UPDATE assenze SET ename = '$ename', starts = '$starts', ends = '$ends' WHERE idAssenza = $id AND nomeUtente = '$nomeUtente'"; //

    if (mysqli_query($conn, $sql)) {
          echo "Record updated successfully";
        } else {
          echo "Error updating record: " . mysqli_error($conn);
        }

       mysqli_close($conn);

MODAL:

<div  id="editNewEvent" aria-hidden="true" aria-labelledby="editNewEvent" role="dialog" tabindex="-1" data-show="false" data-toggle="modal">
                    <div >
                        <form  role="form">
                            <div >
                                <button type="button"  aria-hidden="true" data-dismiss="modal">×</button>
                                <h4 >Modifica Assenza di <input type="text" name="editNomeUtente" id="editNomeUtente" value="editNomeUtente" disabled></h4>
                            </div>
                            <div >
                                <div >
                                    <label  for="editEname">Tipo:</label>
                                    <input list="assenza" name="editEname" id="editEname" style="margin-left: 15px;" />
                                    <datalist id="assenza">
                                        <option value="Normali">
                                        <option value="Straordinarie">                        
                                        <option value="Ferie">
                                        <option value="Malattia">
                                        <option value="Permesso">
                                        <option value="Smart Working">
                                        <option value="Trasferta">
                                        <option value="Assenza non retribuita">
                                        <option value="Altro">
                                    </datalist>  
                                    <input type="hidden" name="editNomeUtente" id="editNomeUtente" value="<?php echo $_SESSION["nomeUtente"]; ?>">
                                </div>                                  
                                <div >
                                    <label  for="editStarts">Inizio:</label>
                                    <div >
                                        <div >
                                            <input type="datetime-local"  id="editStarts" name="editStarts" data-container="#editNewEvent">
                                        </div>
                                    </div>
                                </div>
                                <div >
                                    <label  for="editEnds">Fine:</label>
                                    <div >
                                        <div >
                                            <input type="datetime-local"  id="editEnds" name="editEnds"data-container="#editNewEvent">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div >
                                <div >
                                    <button  data-dismiss="modal" type="button" id="salva">Salva modifiche</button>
                                    <button  id="annulla" href="">Annulla</button>                                 
                                </div>                  
                            </div>
                        </form>
                    </div>
                </div>

CodePudding user response：

Because you trigger event it (hidden.bs.modal), event this will be call when you close modal -> call to -> eventi/updateEvent.php. I suggest you should be call event update when only you click to button Salva modifiche