AJAX Request on Select2 Change

[engelhar...@gmail.com]

I'm utilizing multiple Select2 fields for controlling data flow and selection for some forms. So, I have, for example, one Select2 disabled until another Select2 has an option selected in it. Once an option is chosen from the first Select2, I want to have an AJAX request that pulls information and adds it to the second Select2. I know what I have should work, but I'm getting the following error:
Can only call HTMLFormElement.submit on instances of HTMLFormElement

The code is as follows:
$(document).on("change", "#business_unit", function (e) {
e.preventDefault();

$.ajax({
url: handler + "getUserGroupsForBusinessUnit",
type: "POST",
data: { businessUnit : $(this).val("id")},
success: function (response, textStatus, jqXHR) {
response = JSON.parse(response);
var option;

if (response.success) {
swalTitle = successTitle;
swalClass = success;

$.each(response.userGroup, function (key, value) {
option = new Option(value, key);
$("#user_group").append(option);
});

$("#user_group").trigger("change");
$("#user_group").prop("disabled", false);
} else {
swalTitle = errorTitle;
swalClass = error;
}

swal.close();

if (swalTitle == errorTitle) {
displayInfoSWAL(swalTitle, response.message, swalClass);
}
},
beforeSend: function() {
displayLoadingSWAL();
},
error: function(jqXHR, textStatus, errorThrown){
console.error(
"The following error occurred: "+
textStatus, errorThrown
);
}
});

return false;
});