form ajax set up correctly, still pending

This commit is contained in:
2021-05-15 15:53:38 -05:00
parent b4732f0e95
commit 5b67636e45

View File

@@ -285,17 +285,17 @@
<div class="h6"><i class="fa fa-envelope pe-2 text-muted" style="width:24px;opacity:0.85;"></i> daniel@danieltam.net</div> <div class="h6"><i class="fa fa-envelope pe-2 text-muted" style="width:24px;opacity:0.85;"></i> daniel@danieltam.net</div>
</div> </div>
<div class="mt-5 d-print-none"> <div class="mt-5 d-print-none">
<form onsubmit='sendMessage();'> <form action="" method="post" id="msgForm">
<div class="form-outline mb-4"> <div class="form-outline mb-4">
<input type="text" id="name" class="form-control" disabled required/> <input type="text" id="name" class="form-control" name="name" disabled required/>
<label class="form-label" for="name">Name</label> <label class="form-label" for="name">Name</label>
</div> </div>
<div class="form-outline mb-4"> <div class="form-outline mb-4">
<input type="email" id="email" class="form-control" disabled required/> <input type="email" id="email" class="form-control" name="email" disabled required/>
<label class="form-label" for="email">Email address</label> <label class="form-label" for="email">Email address</label>
</div> </div>
<div class="form-outline mb-4"> <div class="form-outline mb-4">
<textarea class="form-control" style="resize: none;" id="message" rows="4" disabled required></textarea> <textarea class="form-control" style="resize: none;" id="message" rows="4" name="message" disabled required></textarea>
<label class="form-label" for="message">Message</label> <label class="form-label" for="message">Message</label>
</div> </div>
<button class="btn btn-info btn-block mb-4" disabled>Send</button> <button class="btn btn-info btn-block mb-4" disabled>Send</button>
@@ -340,31 +340,21 @@
<script src="scripts/aos.js?ver=1.2.1"></script> <script src="scripts/aos.js?ver=1.2.1"></script>
<script src="scripts/main.js?ver=1.2.1"></script> <script src="scripts/main.js?ver=1.2.1"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.slim.min.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script language="javascript"> <script language="javascript">
// $("#msgForm").submit(function(e) {
e.preventDefault();
function sendMessage() { var form = $(this);
// get form data var url = form.attr('action');
let formData = {
name: $('#name').val(),
email: $('#email').val(),
message: $('#message').val(),
};
// send data from the form
$.ajax({ $.ajax({
type: 'POST', type: "POST",
url : '/message', url: url,
data: formData, data: form.serialize(),
dataType: "json", success: sendSuccess()
encode: true,
success: sendSuccess(),
error: swal("Error", "There has been an error submitting your form. Please try again.", "error"),
}); });
});
}
function sendSuccess() { function sendSuccess() {
$('#name').val(''); $('#name').val('');