assetflow/static/js/formHandler.js

var amountOfForms = $('.frontendForm').length;
$('.frontendForm').each(function() {
	$(this).on('submit', function(e) {
		e.preventDefault();

		var form = $(this);

		// Show overlay with spinner
		$('.loader-overlay').addClass('loaderActive');
		

		formData = form.serializeArray();
		console.log('submitting form');
		$.ajax({
			type: $(this).attr('method'),
			url: $(this).attr('data-target'),
			data: formData,
			dataType: 'json',
			success: function(data) {
				console.log('success');
				// Hide overlay with spinner
				$('.loader-overlay').removeClass('loaderActive');
				// Close the modal
				$('.modal').modal('hide');
				// Clear all fields
				form.find('input, textarea').val('');
				// Create toast
				createNewToast('<i class="bi bi-check2"></i> Changes saved successfully.', "text-bg-success") 
			},
			error: function(data) {
				console.log('error');
				// Hide overlay with spinner
				$('.loader-overlay').removeClass('loaderActive');

				// Check for response code 409
				if (data.status == 409) {
					createNewToast('<i class="bi bi-exclamation-triangle-fill"></i> The element you tried to create already exists.', "text-bg-danger", 3000, false) 
				}else {
					createNewToast('<i class="bi bi-exclamation-triangle-fill"></i> Something went wrong. Please try again later.', "text-bg-danger", 3000, false) 
				}
			}
		});
	})
});

console.info("Found " + amountOfForms + " forms on this page.")