我在 php.ini 中创建了动态按钮。我需要在该动态按钮单击事件的同一主页中打开新表单，当我单击按钮时，它会刷新页面。如何解决这个问题
这是我尝试过的代码
<?php
function dash() {
include 'config.php';
$sql = "SELECT roomno FROM roombook";
if($result = mysqli_query($db, $sql)){
$str = '';
while($row = mysqli_fetch_array($result)){
// generate array from comma delimited list
$rooms = explode(',', $row['roomno']);
//create the dynamic button and set the value
foreach ( $rooms as $k=>$v ){
$str .= '<input type="submit" class="Click" onClick="showDiv()" name="btn_'.$k.'" value="'.$v.'" id="btn_'.$k.'"/>';
}
//return $str;
}
return $str;
}else {
echo "ERROR: Could not able to execute $sql. " . mysqli_error($db);
}
mysqli_close($db);
}
?>
<!Doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>room boking</title>
<link href="css/bootstrap1.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/front.css">
</head>
<body>
<form mathod="post" action="">
<div class =" row box col-md-4" >
<div style="color:black"><?php echo dash();?></div>
</div>
<script>
function showDiv() {
document.getElementById('link').style.display = "block";
}
</script>
</form>
最佳答案
您可以引导表单，这样它看起来就会很有效
http://jsfiddle.net/KyleMit/0fscmf3L/
试试这个
它有 html 和 css 代码，因此您只需集成它，就可以在同一页面和弹出窗口中打开表单
HTML 代码
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModalHorizontal">
Launch Horizontal Form
</button>
<!-- Modal -->
<div class="modal fade" id="myModalHorizontal" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header">
<button type="button" class="close"
data-dismiss="modal">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">
Modal title
</h4>
</div>
<!-- Modal Body -->
<div class="modal-body">
<form class="form-horizontal" role="form">
<div class="form-group">
<label class="col-sm-2 control-label"
for="inputEmail3">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control"
id="inputEmail3" placeholder="Email"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label"
for="inputPassword3" >Password</label>
<div class="col-sm-10">
<input type="password" class="form-control"
id="inputPassword3" placeholder="Password"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox"/> Remember me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
</form>
</div>
<!-- Modal Footer -->
<div class="modal-footer">
<button type="button" class="btn btn-default"
data-dismiss="modal">
Close
</button>
<button type="button" class="btn btn-primary">
Save changes
</button>
</div>
</div>
</div>
</div>
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModalNorm">
Launch Normal Form
</button>
<!-- Modal -->
<div class="modal fade" id="myModalNorm" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal Header -->
<div class="modal-header">
<button type="button" class="close"
data-dismiss="modal">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">
Modal title
</h4>
</div>
<!-- Modal Body -->
<div class="modal-body">
<form role="form">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control"
id="exampleInputEmail1" placeholder="Enter email"/>
</div>
<div class="form-group">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control"
id="exampleInputPassword1" placeholder="Password"/>
</div>
<div class="checkbox">
<label>
<input type="checkbox"/> Check me out
</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</div>
<!-- Modal Footer -->
<div class="modal-footer">
<button type="button" class="btn btn-default"
data-dismiss="modal">
Close
</button>
<button type="button" class="btn btn-primary">
Save changes
</button>
</div>
</div>
</div>
</div>
<!-- Post Info -->
<div style='position:fixed;bottom:0;left:0; background:lightgray;width:100%;'>
About this SO Question:
<a href='http://stackoverflow.com/q/26562900/1366033'>
Twitter Bootstap - form in Modal fomatting
</a><br/>
Fork This Skeleton Here:
<a href='http://jsfiddle.net/KyleMit/kcpma/'>
Bootstrap 3 Skeleton
</a><br/>
</div>
CSS代码
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
希望这对你有帮助
关于javascript - 如何在PHP中的动态按钮单击事件上打开新表单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44067592/