Не отправляется post запрос через ajax с формы, пока не перезагружу страницу. Как починить?

Question

[xmahopnyan]

Есть форма, с которой через form_input.val() забираю значения и отправляю их post запросом на сервер. Как только открываю страницу, заполняю форму и пытаюсь отправить получают ответ что поля не могут быть пустыми, получается что jquery не получает никаких значений с формы. Как только перезагружаю страницу (форма при этом остается заполненной) - сразу отправляется. Значения получаю так:

var switch_name = $('#switch_name');
var switch_ip_address = $('#switch_ip_address');
var switch_vlan = $('#switch_vlan');
var switch_start_ip = $('#switch_start_ip');
var switch_end_ip = $('#switch_end_ip');
var switch_count_ports = $('#switch_count_ports')

var arr = {
    name: String(switch_name.val()),
    ip_address: String(switch_ip_address.val()),
    vlan: Number(switch_vlan.val()),
    start_ip: Number(switch_start_ip.val()),
    end_ip: Number(switch_end_ip.val()),
    count_ports: Number(switch_count_ports.val()),
    ports: addManyPorts()
}

$('#post-button').click(function (e) {
    addSwitch();
    e.preventDefault()
})

AJAX-запрос:

function addSwitch() {
        $.ajax({
            url: '/dhcp/api/',
            type: 'POST',
            data: JSON.stringify(arr),
            contentType: 'application/json; charset=utf-8',
            beforeSend: function (xhr, settings) {
                xhr.setRequestHeader("X-CSRFToken", '{{ csrf_token }}');
            },
            dataType: 'json',
            async: false,
            success: function (msg) {
                console.log(msg);
            },
            error: function (msg) {
                console.log(msg)

            }
        });
    }

Answer 1

[uncletobe]

Потому что, когда Вы грузите страницу, то пытаетесь получить значения из инпутов:
var switch_name = $('#switch_name');
Но они у вас еще пусты! Т.е. страница загрузилась, скрипт берет данные из инпутов и ничего нету. Вам нужно обернуть это в какую-то функцию(все получения данных из инпутов) и запихнуть ее вызов на событие клика, по кнопке отправки.

$('#post-button').click(function (e) {
  getValsFromInputs();
    addSwitch();
    e.preventDefault()
})

Answer 2

[ince]

Покажи вкладку Network браузера с ajax-запросом.