隐藏第一个窗体,然后显示第二个窗体.Secnd表单执行多次提交
Hiding first form and then displaying second. Secnd form performs multiple submits
我有两个带有单个输入字段的表单。当页面加载时,我希望显示第一个表单,并且在提交第一个表单时,我想保留在php中的会话中输入的值以供以后使用。在提交第一个表单后,我想使用jquery取消隐藏第二个表单。第二个表单执行多次提交。我面临的问题是,提交的第二张表格会带回第一张表格,而我在提交这两张表格时遇到了麻烦。我希望第二种形式保持一致,并希望最初只打开第一种形式一次。
这是我正在使用的代码:
JS
<script>
$(document).ready(function() {
$("#submitvendor").click(function() {
$("#vendorform").hide(1000);
$("#imeiform").css("display", "block");
})
});
</script>
HTML
<div id="vendorform" class="container" style = " position: relative; top: 50px ;left: 20px ; width: 500px; border: 7px solid #c68c53; border-bottom-left-radius: 30px; border-top-right-radius: 30px; padding: 25px;">
<form id="vendor" class="form-inline" role="form" action="<?php echo $_SERVER['PHP_SELF']; ?>" method = "POST" >
<div class="form-group">
<label >Vendor Reference:     </label>
<input type="text" class="form-control" id="vendorreference" name="vendorreference" placeholder="Enter Vendor Reference here" required>   
</div>
<input type="submit" id="submitvendor" name="Submit" value="Submit">
</form>
</div>
<div id="imeiform" class="container" style = " display: none; position: relative; top: 70px ;left: 20px ; width: 500px; border: 7px solid #c68c53; border-bottom-left-radius: 30px; border-top-right-radius: 30px; padding: 25px;">
<form class="form-inline" role="form" action="<?php echo $_SERVER['PHP_SELF']; ?>" method = "POST" >
<div class="form-group">
<label >                IMEI:     </label>
<input type="text" class="form-control" id="imei" name="imei" placeholder="Enter IMEI here" required >   
</div>
<input type="submit" id="imei" class="btn btn-default" name="Submit" value="SUBMIT">
</form>
</div>
PHP
<?php
session_start();
include_once('config.php');
if (isset($_POST['Submit'])) {
if (!isset($_SESSION['vendor'])) {
$_SESSION['vendor'] = $_POST['vendorreference'];
}
echo "Submitted";
}
if (isset($_POST['SUBMIT'])) {
$imei = $_POST['imei'];
echo "Second form submitted";
}
?>
您只需使用PHP、就可以实现这一点
HTML
<div id="vendorform" class="container" style = "display:<?php echo ($top_form == "Y" ) ? "block": "none"; ?>; position: relative; top: 50px ;left: 20px ; width: 500px; border: 7px solid #c68c53; border-bottom-left-radius: 30px; border-top-right-radius: 30px; padding: 25px;">
<form id="vendor" class="form-inline" role="form" action="<?php echo $_SERVER['PHP_SELF']; ?>" method = "POST" >
<div class="form-group">
<label >Vendor Reference:     </label>
<input type="text" class="form-control" id="vendorreference" name="vendorreference" placeholder="Enter Vendor Reference here" required>   
</div>
<input type="submit" id="submitvendor" name="first_form" value="Submit">
</form>
</div>
<div id="imeiform" class="container" style = "display:<?php echo ($bottom_form == "Y" ) ? "block": "none"; ?>; position: relative; top: 70px ;left: 20px ; width: 500px; border: 7px solid #c68c53; border-bottom-left-radius: 30px; border-top-right-radius: 30px; padding: 25px;">
<form class="form-inline" role="form" action="<?php echo $_SERVER['PHP_SELF']; ?>" method = "POST" >
<div class="form-group">
<label >                IMEI:     </label>
<input type="text" class="form-control" id="imei" name="imei" placeholder="Enter IMEI here" required >   
</div>
<input type="submit" id="imei" class="btn btn-default" name="second_form" value="SUBMIT">
</form>
</div>
PHP
<?php
session_start();
include_once('config.php');
$top_form = "Y";
$bottom_form = "N";
if (isset($_POST['first_form'])) {
if (!isset($_SESSION['vendor'])) {
$_SESSION['vendor'] = $_POST['vendorreference'];
}
$top_form = "N";
$bottom_form = "Y";
}
if (isset($_POST['second_form'])) {
$imei = $_POST['imei'];
$top_form = "N";
$bottom_form = "Y";
echo "Second form submitted";
}
?>
我在顶部设置了两个控制风格行为的标志,让我知道它是否适合你。
隐藏第一个表单的最简单方法是在提交后将其css设置为display:none
。
把你的PHP逻辑放在首位。在将任何HTML发送到浏览器之前,session_start()
尤其应该在开头附近。由于PHP可以判断表单何时提交,因此可以使用它来设置适当的样式。无需Javascript
<?php
session_start();
...
$vendor_style = isset($_POST['Submit'])? 'display:none;': 'display:block;';
$imei_style = isset($_POST['Submit'])? 'display:block;': 'display:none;';
...
?>
然后在HTML中的页面下方,您可以根据第一个表单是否已提交将显示设置为无或阻止
<form id="vendor" style="<?= $vendor_style ?>" class="form-inline"...
...
<form id="imei" style="<?= $imei_style ?>" class="form-inline"...
很明显,你必须用PHP进行一些表单验证,但你已经明白了。
相关文章:
- 防止Iframe窗体在新窗口中打开
- 无法在通过jQuery的ajax加载的页面中执行javascript
- JavaScript执行暂时挂起页面
- 如何在ReactJS JSX中执行嵌套的if-else语句
- 当js函数's已执行
- 哪个先执行
- 在使用Polymer'加载所有json文件后执行方法;s的核心ajax
- HTML表单提交时未执行外部函数
- 在Safari执行javascript之前对其进行修改
- Amd,希望确保某个东西总是最后执行
- Meteor-将选定窗体中的对象添加到集合中
- 在Windows 10中自动执行例行程序(主要与浏览器交互)
- 递归使用 eval() 是检查程序执行的好方法吗?
- 如何做到这一点,使代码在不传递条件后执行函数
- 从 GridView 执行 Javascript 函数 ItemTemplate“按钮单击”Web 窗体 ASP.NET
- 如何打开模态窗体,在控制器中执行操作,并在 Grails 中呈现结果
- 仅执行的第一个函数-由两个窗体的.osubmit调用的两个函数中的一个
- Ruby on rails render partial不从主窗体视图执行javascript
- 隐藏第一个窗体,然后显示第二个窗体.Secnd表单执行多次提交
- 我无法从javascript执行ShellExecute来运行带参数的Windows窗体