Question

使用jquery对话作为模式来使用PHP来显示我的表单错误。一切正常，除了页面加载外，显示正确...显示空模式。如果你关闭它然后继续填写模态按预期工作的形式，在它单击的提交按钮时显示错误（如果有的话）。为简洁起见，我只包括相关代码。

我正在寻求有关如何防止空模式在页面加载时显示的帮助。我已经审查了数十个相关的提交内容并试图尝试实施这些内容，结果令人沮丧。在大多数情况下，它们要么没有效果，要么最终一起禁用模态。

提前感谢任何建议。

<?php

/// php error checking and form processing here ///

?>

<!DOCTYPE HTML>
<html>
<head>
<title>Page Title</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" media="screen" />
</head>
<body>

<form action="<?=$_SERVER['PHP_SELF']?>" name="inquiry" method="post">

/// form fields here ///

<ul class="actions">
<li><input type="submit" class="button small" name="submit" id="submit" value="Send Inquiry" /></li>
</ul>

</form>

<div id="error" title="Form Errors:">
<?php
if (!empty($errors))
{
echo "<div style=\"padding:15px 15px 0 15px\">";
echo "<ul style=\"margin-bottom:20px\">";
foreach ($errors as $error)
echo "<li style=\"font-size:15px; padding:5px\">$error</li>";
echo "</ul></div>";
}
?>
</div>

<!-- JS at the end -->

<script src="/assets/js/jquery.min.js"></script><!-- ver: 1.11.3 -->

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>  

<script>
$('#error').dialog({
height: 380,
width: 260,
modal: true,
resizable: false,
dialogClass: 'no-close error-dialog'
});
</script>

</body>
</html>

Answer 1

您可以通过使用dialog提交表单时调用$_POST["submit"] init来阻止此操作：

<script>
     <?php if( isset( $_POST["submit"] ) ){ ?> 
         $('#error').dialog({
             height: 380,
             width: 260,
             modal: true,
             resizable: false,
             dialogClass: 'no-close error-dialog'
         });
     <?php } ?>
</script>

页面加载时不需要的空模态

1 个答案: