Я получаю сообщение об ошибке «Неопределенный тип» при отправке модальной формы. ⇐ Javascript

[Anonymous]

У меня есть простая модальная форма html/js, когда я отправляю ее для ответа на консоль (следующее намерение — отправить на сервер), я получаю ошибку:
Uncaught TypeError: невозможно прочитать свойства неопределенного значения (чтение «classList»)
Код выглядит хорошо (для меня).
Кнопка запуска открывает модальное окно, заполните форму, см. ошибка. Я просматриваю консоль на вкладке разработчиков через Chrome.
HTML/JS (CSS ниже)








Sandbox · Bootstrap v5.0










.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
.modal-top{
background:#9aa69c
}
.modal-bg{
background:#737393
}









Home
Features
Contact





SandBox
Lets Play

Launch




Get Bootstrap, by @mdo.





class="modal-content modal-bg w-75">


button>





Name




Email address




Your message


Send













Success



Thank You. Your Message has been Sent.













function loadSender(){

document.addEventListener('DOMContentLoaded', function(){
const cModal = document.getElementById("btnSubmit");
const modalSubmit = new bootstrap.Modal(cModal);

const xModal = document.getElementById("modalContact");
const modalLaunch = new bootstrap.Modal("xModal");

const zModal = document.getElementById("modalCheck");
const modalOpenCheck= new bootstrap.Modal("zModal");

const nameField = $(document.getElementById("txtName"));
const name = nameField.value;

const emailField = $(document.getElementById("txtEmail"));
const email = emailField.value;

const messageField = $(document.getElementById("txtMessage"));
const message = messageField.value;

callASMX(name, email, message);
//document.modalLaunch.hide;
//document.modalLaunch.reset;
//document.modalOpenCheck.show;
});
}



function callASMX(name, email, message){
// Intent to send data to server
console.log("name: " + name);
console.log("email: " + email);
console.log("message: " + message);
}






COVER.CSS
Я получаю сообщение об ошибке при отправке простой модальной формы.
Ошибка: Uncaught TypeError: невозможно прочитать свойства неопределенного значения (чтение «classList»). Код выглядит хорошо (мне), чего мне не хватает?
HTML (CSS ниже):








Sandbox · Bootstrap v5.0










.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
.modal-top{
background:#9aa69c
}
.modal-bg{
background:#737393
}









Home
Features
Contact





SandBox
Lets Play

Launch




Get Bootstrap, by @mdo.





class="modal-content modal-bg w-75">


button>





Name




Email address




Your message


Send













Success



Thank You. Your Message has been Sent.













function loadSender(){

document.addEventListener('DOMContentLoaded', function(){
const cModal = document.getElementById("btnSubmit");
const modalSubmit = new bootstrap.Modal(cModal);

const xModal = document.getElementById("modalContact");
const modalLaunch = new bootstrap.Modal("xModal");

const zModal = document.getElementById("modalCheck");
const modalOpenCheck= new bootstrap.Modal("zModal");

const nameField = $(document.getElementById("txtName"));
const name = nameField.value;

const emailField = $(document.getElementById("txtEmail"));
const email = emailField.value;

const messageField = $(document.getElementById("txtMessage"));
const message = messageField.value;

callASMX(name, email, message);
//document.modalLaunch.hide;
//document.modalLaunch.reset;
//document.modalOpenCheck.show;
});
}



function callASMX(name, email, message){
// Intent to send data to server
console.log("name: " + name);
console.log("email: " + email);
console.log("message: " + message);
}






CSS ОБЛОЖКИ:
/*
* Globals
*/

/* Custom default button */
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
color: #333;
text-shadow: none; /* Prevent inheritance from `body` */
}

/*
* Base structure
*/

body {
text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
}

.cover-container {
max-width: 42em;
}

/*
* Header
*/

.nav-masthead .nav-link {
padding: .25rem 0;
font-weight: 700;
color: rgba(255, 255, 255, .5);
background-color: transparent;
border-bottom: .25rem solid transparent;
}

.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
border-bottom-color: rgba(255, 255, 255, .25);
}

.nav-masthead .nav-link + .nav-link {
margin-left: 1rem;
}

.nav-masthead .active {
color: #fff;
border-bottom-color: #fff;
}



Подробнее здесь: https://stackoverflow.com/questions/797 ... modal-form