我正在使用 DOMPDF 库生成 PDF,到目前为止一切顺利,但我收集的已完成表单字段未在 PDF 中收集和显示。我想知道我做错了什么,我将把我的部分代码放在下面(我是巴西人,请原谅我的英语)
HTML
<form class="form-req" id="form" method="POST">
<div class="full-form">
<h2><span>1</span> Data:</h2>
<p>Benefit Plans</p>
</div>
<div class="flex-form">
<div class="aside-form">
<label for="completeName">Complete Name<b class="blue-obg">*</b></label>
<input type="text" name="your-name" >
</div>
<div class="aside-form">
<label for="cpf">CPF<b class="blue-obg">*</b></label>
<input type="text" name="your-cpf" class="cpf" >
</div>
</div>
<div class="standard-button-form req-btn">
<input type="submit" id="submit" value="Generate PDF">
</div>
<div class="alert">
<span class="alert_error">Error</span>
<span class="alert_sucess">PDF generated!</span>
</div>
</form>
<script>
$(document).ready(function () {
$('form.form-req input[type=submit]').on('click', function (e) {
e.preventDefault();
var form = $(this);
var formData = form.serialize();
$.ajax({
url: '../generate-pdf', //Through page in wordpress
type: 'POST',
data: formData,
success: function (response) {
console.log(response);
$('.alert_sucess').fadeIn();
window.location.replace("https://fabiocaspirro/generate-pdf");
},
error: function (xhr, status, error) {
console.log(error);
$('.alert_error').fadeIn();
},
complete: function () {
$('.alert_error, .alert_sucess').fadeOut(3000);
}
});
});
});
</script>
生成-pdf.php
<?php
use Dompdf\Dompdf;
use Dompdf\Options;
require_once 'dompdf/autoload.inc.php';
$options = new Options();
$options->set('isRemoteEnabled', TRUE);
$name = $_POST["your-name"];
$cpf = $_POST["your-cpf"];
$dompdf = new Dompdf($options);
$content = '
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
</style>
</head>
<body>
<!-- Define header and footer blocks before your content -->
<header>
</header>
<footer>
</footer>
<!-- Wrap the content of your PDF inside a main tag -->
<main>
<table class="table table-dados-cadastrais">
<tbody>
<tr>
<td colspan="2">
<p class="title-field-form">Complete Name</p>
<span class="box-field-form">'.$name.'</span>
</td>
<td colspan="2">
<p class="title-field-form">CPF</p>
<span class="box-field-form">'.$cpf.'</span>
</td>
</tr>
</tbody>
</table>
</main>
</body>
</html>
';
$dompdf->loadHtml($content);
$dompdf->setPaper('A4', 'portrait');
$dompdf->render();
$dompdf->stream("Form", array("Attachment" => 1));
我不知道还能做什么,我尝试了不同的方法,但没有用。它恰好生成了正确的 PDF,但它没有收集我在发送之前填写表单的变量
我希望尽快解决这个问题。我已经尝试了两天来找到问题所在,我尝试了多种方法但没有成功。其中,print_r、echo、DIR、files_get_contents、var_dump、尝试通过另一个带有 html 的文件读取数据...等等。
您的 jQuery 有两个问题。首先,
$(this)
指的是您的提交按钮,而不是您的表单。我建议将事件侦听器添加到表单提交中。其次,使用 AJAX 请求的完整 URL。我在我的机器上本地测试过,它有效。
<script>
$(document).ready(function () {
$('#form').on('submit', function (e) {
e.preventDefault();
var form = $(this);
var formData = form.serialize();
$.ajax({
url: 'https://fabiocaspirro/generate-pdf.php', //Through page in wordpress
type: 'POST',
data: formData,
success: function (response) {
console.log(response);
$('.alert_sucess').fadeIn();
window.location.replace("https://fabiocaspirro/generate-pdf");
},
error: function (xhr, status, error) {
console.log(error);
$('.alert_error').fadeIn();
},
complete: function () {
$('.alert_error, .alert_sucess').fadeOut(3000);
}
});
});
});
</script>