Formlister + ajax modal bootstrap

footer.html

<!-- Modal -->
<div class="modal fade" id="form-modal" tabindex="-1" role="document" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h5 class="modal-title"></h5>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
				<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body" id="form-modal-body"></div>
		</div>
	</div>
</div>
<!-- Modal -->
<script>
	$(function(){
		$('.mymodal-open').on('click',function(){
			var href = $(this).data("href");
			$.ajax({
				method:'get',
				url: href,
				success: function(response){
					$('#form-modal-body').empty().html(response);
					$('#form-modal').modal('show');
				}
			});
		});

		$(document).on('submit', '.ajaxmodal-form' ,function(e){
			e.preventDefault();
			var form = $(this);
			var formData = new FormData(form[0]);
			$('#form-modal').modal('show');
			$('#form-modal-body').empty().html('<i class="fas fa-spinner fa-spin"></i> Отправляю форму');
			$.ajax({
				type: form.attr('method'),
				url: form.attr('action'),
				data: formData,
				processData: false,
				contentType: false,
				dataType: "html",
				success: function(response){
					$('#form-modal-body').empty().html(response);
					$('#form-modal').modal('show');
					form[0].reset();
				}
			});
			return false;
		});
	});
</script>

formDetails.snippet.php

<?php
if(isset($_GET['page'])){
	$page = intval($_GET['page']);
	
	if($page > 0){
		$doc = $modx->getDocument($page);

		if(!empty( $doc )){
			$link = $modx->makeUrl($page, '', '', 'full');
			$title = $doc['pagetitle'];

			$FormLister->setField('title',$title);
			$FormLister->setField('link',$link);
		}
	}
}

formFake.snippet.php

<?php
if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']) || (strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) != 'xmlhttprequest')){
	$modx->sendForward($modx->getConfig('error_page'));
	die();
}

Formlister call

[!formFake!][!FormLister?
	&formTpl=`@CODE:
		<h3>[*pagetitle*]</h3>
		<p>[*introtext*]</p>
		<form action="[~[*id*]~]" method="post" id="ajaxform" class="ajaxmodal-form">
			<div>[+form.messages+]</div>
			<label class="d-block form-group">
				Ваше имя* :
				<input type="text" class="form-control [+name.errorClass+]" id="name" name="name" placeholder="Как к вам обращаться" value="[+name.value+]" required>
				[+name.error+]
			</label>
			<label class="d-block form-group">
				Файл* :
				<input type="file" class="form-control [+file.errorClass+]" id="file" name="file" required>
				[+file.error+]
			</label>
			<button type="submit" class="btn btn-primary" name="submit">Отправить</button>
			<input type="hidden" name="title" value="[+title.value+]">
			<input type="hidden" name="link" value="[+link.value+]">
			<input type="hidden" name="formid" value="ajaxform">
		</form>`
	&subject=`Заявка с сайта: [*pagetitle*]`
	&protectSubmit=`0`
	&submitLimit=`0`
	&formid=`ajaxform`
	&to=`[email protected]`
	&attachments=`file`
	&fileRules=`{"file":{
    "optional":"Не удалось загрузить файл",
    "maxSize" : {
        "params": 10024,
        "message": "Размер файла не должен превышать 10 мб"
    }}`
	&rules=`{"name":{"required":"Введите имя"},"!file":{"required":"Мы заявки без файлов не принимаем"},"link":{"required":"Ссылка не может быть пустой"},"title":{"required":"Заголовок не может быть пустым"}}`
	&reportTpl=`@CODE: 
		<p>На сайте «[(site_name)]» — [(site_url)] была отправлена заявка: <b>[*pagetitle*]</b></p>
		<p><b>Отправлено со страницы:</b> [+title+] ([+link+])</p>
		<p><b>Имя:</b> [+name+]</p>
		<p><b>Файл:</b> [+file+]</p>[+attachments+]`
	&successTpl=`@CODE: <h3>Отправка заявки</h3><p>Ваша заявка была успешно отправлена</p>`
	&errorClass=`is-invalid`
	&requiredClass=`is-invalid`
	&messagesTpl=`@CODE: <div class="invalid-feedback">[+messages+]</div>`
	&prepare=`formDetails`
!]