php中的Bootstrap模型同时循环数据问题
[英]Bootstrap model in php while loop data issue
问题描述
我正在while loop html table使用带有详细信息按钮的Bootstrap模型和html table 。 目前的情况是我只是在表中显示数据，并从数据库中获取数据。 屏幕截图
当我单击此列表中的任何按钮时，仅使用详细信息按钮实现Bootstrep模型，仅显示数据的第一项。 例如，当我单击第三个按钮时，模型将显示第一个按钮输入数据。
这是我的代码
<?php
include_once("..\connection.php");
if(isset($_GET['q'])){
$q = ($_GET['q']);
$sql="SELECT * FROM propertytable WHERE property_name like '%".$q."%' OR property_desc like '%".$q."%' OR property_type like '%".$q."%' OR property_sub_type like '%".$q."%' OR property_service like '%".$q."%' OR propert_location like '%".$q."%'";
$result = mysqli_query($conn,$sql);
}else
{
$type = ($_GET['type']);
$sub_Type = ($_GET['subType']);
$property_service = ($_GET['propertyService']);
$property_location = ($_GET['propertyLocation']);
$start_Prize = ($_GET['startPrize']);
$end_Prize = ($_GET['endPrize']);
//echo $property_service; exit;
include_once("..\connection.php");
$sql="SELECT * FROM propertytable WHERE property_name like '%".$type."%' OR property_sub_type like '%".$sub_Type."%'";
if($property_service !="" && $property_service!="Select Property Service")
$sql.=" AND property_service like '%".$property_service."%'";
if($property_location!="")
$sql.=" AND property_location like '%".$property_location."%'";
if($start_Prize!="" AND $end_Prize!="")
$sql.= " AND property_prize between '".$start_Prize."' AND '".$end_Prize."' ";
$result = mysqli_query($conn,$sql);
}
echo "<br>";
echo "<div class='container'>";
echo "<table border='0' align='center' cellspacing='10' id='mytable'>";
$i=1;
while($row = mysqli_fetch_array($result)) {
echo "<tr><td><img src='..\\".$row['image_front']."' style='width:150px; height:150px; vertical-align: text-top'></td>
<td valign='top'><span style='font-weight:bold; margin-top:10cm '>Name: </span>".$row['property_name']."<br /><br />
<span style='font-weight:bold; '>Description: </span>".$row['property_desc']."<br /><br />
<span style='font-weight:bold; '>Property Type: </span>".$row['property_type']."<br /><br />
<span style='font-weight:bold; '>Property Sub Type: </span>".$row['property_sub_type']."<br /><br />
<div style='float: right; text-align: right; width: 50%;'>
<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-target='#myModal' id='modelbutton'>
Details
</button>
</div>
<div class='modal fade' id='myModal".$i."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel'>
<div class='modal-dialog' role='document'>
<div class='modal-content'>
<div class='modal-header'>
<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>×</span></button>
<h4 class='modal-title' id='myModalLabel'> Property Details</h4>
</div>
<div class='modal-body'>
<div id='myCarousel' class='carousel slide' data-ride='carousel'>
<ol class='carousel-indicators'>
<li data-target='#myCarousel' data-slide-to='0' class='active'></li>
<li data-target='#myCarousel' data-slide-to='1'></li>
<li data-target='#myCarousel' data-slide-to='2'></li>
</ol>
<div class='carousel-inner' role='listbox'>
<div class='item'>
<img src='..\\".$row['image_front']."' alt='property_front'>
</div>
<div class='item'>
<img src='..\\".$row['image_side']."'
alt='property_side'>
</div>
<div class='item active'>
<img src='..\\".$row['image_back']."'
alt='property_back'>
</div>
</div>
</div>
<a class='left carousel-control' href='#myCarousel' role='button' data-slide='prev'>
<span class='glyphicon glyphicon-chevron-left' aria-hidden='true'></span>
<span class='sr-only'>Previous</span>
</a>
<a class='right carousel-control' href='#myCarousel' role='button' data-slide='next'>
<span class='glyphicon glyphicon-chevron-right' aria-hidden='true'></span>
<span class='sr-only'>Next</span>
</a>
</div>
<span style='font-weight:bold; '>Property Service: </span>".$row['property_name']."<br /><br />
<span style='font-weight:bold; '>Property Size: </span>".$row['property_size']."<br /><br />
<span style='font-weight:bold; '>Property Location: </span>".$row['propert_location']."<br />
<div class='modal-footer'>
<button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>
</div>
</div>
</div>
</div>";
$i++;
}
echo "</table>";
mysqli_close($conn);
?>
请提出任何可行的方法。
4 个解决方案
解决方案1
0 2016-06-20 07:23:43
也可以使数据目标动态化
<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-target='#myModal' id='modelbutton'>
至
<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-target='#myModal".$i."' id='modelbutton'>
解决方案2
0 2016-06-20 07:28:12
<?php
include_once("..\connection.php");
if(isset($_GET['q'])){
$q = ($_GET['q']);
$sql="SELECT * FROM propertytable WHERE property_name like '%".$q."%' OR property_desc like '%".$q."%' OR property_type like '%".$q."%' OR property_sub_type like '%".$q."%' OR property_service like '%".$q."%' OR propert_location like '%".$q."%'";
$result = mysqli_query($conn,$sql);
}else
{
$type = ($_GET['type']);
$sub_Type = ($_GET['subType']);
$property_service = ($_GET['propertyService']);
$property_location = ($_GET['propertyLocation']);
$start_Prize = ($_GET['startPrize']);
$end_Prize = ($_GET['endPrize']);
//echo $property_service; exit;
include_once("..\connection.php");
$sql="SELECT * FROM propertytable WHERE property_name like '%".$type."%' OR property_sub_type like '%".$sub_Type."%'";
if($property_service !="" && $property_service!="Select Property Service")
$sql.=" AND property_service like '%".$property_service."%'";
if($property_location!="")
$sql.=" AND property_location like '%".$property_location."%'";
if($start_Prize!="" AND $end_Prize!="")
$sql.= " AND property_prize between '".$start_Prize."' AND '".$end_Prize."' ";
$result = mysqli_query($conn,$sql);
}
echo "<br>";
echo "<div class='container'>";
echo "<table border='0' align='center' cellspacing='10' id='mytable'>";
$i=1;
while($row = mysqli_fetch_array($result)) {
echo "<tr><td><img src='..\\".$row['image_front']."' style='width:150px; height:150px; vertical-align: text-top'></td>
<td valign='top'><span style='font-weight:bold; margin-top:10cm '>Name: </span>".$row['property_name']."<br /><br />
<span style='font-weight:bold; '>Description: </span>".$row['property_desc']."<br /><br />
<span style='font-weight:bold; '>Property Type: </span>".$row['property_type']."<br /><br />
<span style='font-weight:bold; '>Property Sub Type: </span>".$row['property_sub_type']."<br /><br />
<div style='float: right; text-align: right; width: 50%;'>
<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-target='#myModal".$i."' id='modelbutton'>
Details
</button>
</div>
<div class='modal fade' id='myModal".$i."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel'>
<div class='modal-dialog' role='document'>
<div class='modal-content'>
<div class='modal-header'>
<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>×</span></button>
<h4 class='modal-title' id='myModalLabel'> Property Details</h4>
</div>
<div class='modal-body'>
<div id='myCarousel' class='carousel slide' data-ride='carousel'>
<ol class='carousel-indicators'>
<li data-target='#myCarousel' data-slide-to='0' class='active'></li>
<li data-target='#myCarousel' data-slide-to='1'></li>
<li data-target='#myCarousel' data-slide-to='2'></li>
</ol>
<div class='carousel-inner' role='listbox'>
<div class='item'>
<img src='..\\".$row['image_front']."' alt='property_front'>
</div>
<div class='item'>
<img src='..\\".$row['image_side']."'
alt='property_side'>
</div>
<div class='item active'>
<img src='..\\".$row['image_back']."'
alt='property_back'>
</div>
</div>
</div>
<a class='left carousel-control' href='#myCarousel' role='button' data-slide='prev'>
<span class='glyphicon glyphicon-chevron-left' aria-hidden='true'></span>
<span class='sr-only'>Previous</span>
</a>
<a class='right carousel-control' href='#myCarousel' role='button' data-slide='next'>
<span class='glyphicon glyphicon-chevron-right' aria-hidden='true'></span>
<span class='sr-only'>Next</span>
</a>
</div>
<span style='font-weight:bold; '>Property Service: </span>".$row['property_name']."<br /><br />
<span style='font-weight:bold; '>Property Size: </span>".$row['property_size']."<br /><br />
<span style='font-weight:bold; '>Property Location: </span>".$row['propert_location']."<br />
<div class='modal-footer'>
<button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>
</div>
</div>
</div>
</div>";
$i++;
}
echo "</table>";
mysqli_close($conn);
?>
您需要更改数据目标，希望它会有所帮助。
注意：请勿使用mysqli或mysql，请使用PDO避免sql注入
解决方案3
0 2016-06-20 07:28:58
您的while循环如下所示：
while($row = mysqli_fetch_array($result)) {
echo "<tr><td><img src='..\\".$row['image_front']."' style='width:150px; height:150px; vertical-align: text-top'></td>
.......
.......
.......
<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-target='#myModal' id='modelbutton'>
Details
</button>
.......
.......
.......
</div>";
$i++;
}
因此，我在这里发现3个主要问题：
- 您在echo语句中缺少行的tr标签关闭。
- 缺少回响语句第二列的td标签关闭。
- 当您生成动态的按钮时，根据您的模型，按钮的data-target属性不是动态的。
因此，请尝试以下代码：
while($row = mysqli_fetch_array($result)) {
echo "<tr><td><img src='..\\".$row['image_front']."' style='width:150px; height:150px; vertical-align: text-top'></td>
<td valign='top'><span style='font-weight:bold; margin-top:10cm '>Name: </span>".$row['property_name']."<br /><br />
<span style='font-weight:bold; '>Description: </span>".$row['property_desc']."<br /><br />
<span style='font-weight:bold; '>Property Type: </span>".$row['property_type']."<br /><br />
<span style='font-weight:bold; '>Property Sub Type: </span>".$row['property_sub_type']."<br /><br />
<div style='float: right; text-align: right; width: 50%;'>
<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-target='#myModal".$i."' id='modelbutton'>
Details
</button>
</div>
<div class='modal fade' id='myModal".$i."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel'>
<div class='modal-dialog' role='document'>
<div class='modal-content'>
<div class='modal-header'>
<button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>×</span></button>
<h4 class='modal-title' id='myModalLabel'> Property Details</h4>
</div>
<div class='modal-body'>
<div id='myCarousel' class='carousel slide' data-ride='carousel'>
<ol class='carousel-indicators'>
<li data-target='#myCarousel' data-slide-to='0' class='active'></li>
<li data-target='#myCarousel' data-slide-to='1'></li>
<li data-target='#myCarousel' data-slide-to='2'></li>
</ol>
<div class='carousel-inner' role='listbox'>
<div class='item'>
<img src='..\\".$row['image_front']."' alt='property_front'>
</div>
<div class='item'>
<img src='..\\".$row['image_side']."'
alt='property_side'>
</div>
<div class='item active'>
<img src='..\\".$row['image_back']."'
alt='property_back'>
</div>
</div>
</div>
<a class='left carousel-control' href='#myCarousel' role='button' data-slide='prev'>
<span class='glyphicon glyphicon-chevron-left' aria-hidden='true'></span>
<span class='sr-only'>Previous</span>
</a>
<a class='right carousel-control' href='#myCarousel' role='button' data-slide='next'>
<span class='glyphicon glyphicon-chevron-right' aria-hidden='true'></span>
<span class='sr-only'>Next</span>
</a>
</div>
<span style='font-weight:bold; '>Property Service: </span>".$row['property_name']."<br /><br />
<span style='font-weight:bold; '>Property Size: </span>".$row['property_size']."<br /><br />
<span style='font-weight:bold; '>Property Location: </span>".$row['propert_location']."<br />
<div class='modal-footer'>
<button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>
</div>
</div>
</div>
</div></td></tr>";
$i++;
}
希望这对您有用...
解决方案4
0 已采纳 2016-06-21 11:51:19
我只是用另一种方式解决了我的问题。首先，我将模式放在while循环之外。 然后在while循环中按
模态触发按钮的php代码。
<?php
include_once("..\connection.php");
$sql="SELECT * FROM propertytable";
$result = mysqli_query($conn,$sql);
while($row = mysqli_fetch_array($result)) {
echo "<button type='button' class='btn btn-primary btn-lg' data-toggle='modal' data-id='".$row['id']."' data-target='#myModal'>
Launch demo modal
</button>";
}
将模态置于while循环之外
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
</div>
<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>
显示模式时，这是一个ajax代码。
<script>
$(document).ready(function(){
$('#myModal').on('show.bs.modal', function (e) {
var rowid = $(e.relatedTarget).data('id');
$.ajax({
type : 'get',
url : 'info.php', //Here you will fetch records
data : 'id='+ rowid, //Pass $id
success : function(data){
$('.modal-body').html(data);//Show fetched data from database
}
});
});
});
</script>
PHP while循环问题
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.