提交表單后，阻止JS重新加載頁面

Question

我正在使用MVC框架CodeIgniter ， FullCalendar ， Bootstrap和Jquery創建網站。

日歷具有可單擊的事件，這些事件可打開包含表單的模式對話框。
表單似乎可以正常工作，因為正確調用了controller方法並更新了數據庫，但是我想避免網站在提交表單后轉到另一個頁面或重新加載。
我嘗試了幾種方法：

e.preventDefault();
return false; 

和更多...

這是有關模式對話框和表單的HTML：

            <div class="modal-body">
                <form id="myForm" action="<?=base_url()?>index.php/activite/planning_people" method="post">
                    <input type="hidden" id="date" name="date"/>
                    <input type="hidden" id="id" name="id"/>
                    <?php foreach ($people as $person) : ?>
                        <div class="checkbox">
                            <label><input type="checkbox" value="<?=$person['number']?>" name="people[]"><?= $person['firstname']." ".$person['lastname'] ?></label>
                        </div>
                    <?php endforeach; ?>
            </div>

            <div class="modal-footer">
                    <input class="btn btn-lg" type="submit" id="submitButton" value="Validate">
                </form>
            </div>

<div class="container">
    <div id="bootstrapModalFullCalendar"></div>
</div>

這是eventClick事件的javascritpt：

    eventClick:  function(event) {
        var inputs = document.getElementsByTagName('input');

        $('#modalTitle').html(event.title+" "+moment(event.start).format('LL'));
        $('#id').val(event.id.split(" ")[0]);
        $('#date').val(event.id.split(" ")[1]);
        $('#fullCalModal').modal();
    }
});

$('#submitButton').submit(function(e) {
    e.preventDefault();
    $.ajax({
        url: "<?=base_url("index.php/activity/planning_people")?>",
        type: "POST",
        data: $("myForm").serializeArray(),
        success: function(data){
            alert(data);
        },
    });
    return false;
});

此外，不會顯示成功警報。

控制器將重定向到空白頁：

public function planning_people() {
    $people = $this->input->post("people[]");
    $id = $this->input->post("id");
    $date = $this->input->post("date");
    $this->EZ_query->delete_planning($id, $date);

    if ($people != null) {
        foreach ($encadrants as $key => $no) {
            $this->EZ_query->add_planning($id, $date, $no);
        }
    }
}

我的問題已經解決了很多次，並且我檢查了很多同一問題的stackoverflow頁面，但均未成功。 請幫忙 ！
謝謝

Answer 1

1：您需要使用“ submit到表單”而不是“ submit button

$('#myForm').submit(function(e) {

代替

$('#submitButton').submit(function(e) {

2nd：您忘記了myForm id之前的#號

data: $(this).serializeArray(), // or data: $("#myForm").serializeArray(),

代替

data: $("myForm").serializeArray(),