<?php session_start(); include ("config/dbconnect.php"); ?> <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="width=device-width; charset=utf-8" /> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/animate.css"> <style type="text/css"> .product_view .modal-dialog{max-width: 800px; width: 100%;} .pre-cost{text-decoration: line-through; color: #a5a5a5;} .space-ten{padding: 10px 0;} </style> <script src="js/jquery-3.2.1.min.js"></script> <script src="js/bootstrap.min.js"></script> <title>GD Systems</title> </head> <body> <legend>แชมพูและครีมนวดผม</legend> <?php $sql = "SELECT * FROM tb_product WHERE cate_id = 1 "; $result = mysql_query($sql) or die ($connect); while($product = mysql_fetch_assoc($result)) { $product_id = $product['product_id']; $product_name = $product['product_name']; $product_price = $product['product_price']; $product_picture = $product['product_picture']; $product_detail = $product['product_detail']; ?> <div class="container"> <div class="row"> <div class="col-md-3 col-sm-6"> <span class="thumbnail"> <img src="uploadimg/<?php echo $product_picture;?>"> <h4><?php echo ("$product_name");?></h4> <div class="ratings"> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star-empty"></span> </div> <p><?php echo ("$product_detail");?></p> <hr class="line"> <div class="row"> <div class="col-md-6 col-sm-6"> <p class="price">ราคา <?php echo ("$product_price");?> บาท</h4></p> </div> <div class="col-md-6 col-sm-6"> <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#view<?php echo product_id;?>">หยิบใส่ตะกร้า</button> </div> </div> </span> </form> </div> <?php } ?> </div> </div> <div class="modal fade product_view" id="view<?php echo product_id;?>"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <a href="#" data-dismiss="modal" class="class pull-right"><span class="glyphicon glyphicon-remove"></span></a> <h3 class="modal-title">สินค้าที่เลือก</h3> </div> <div class="modal-body"> <div class="row"> <div class="col-md-6 product_img"> <img src="uploadimg/<?php echo $product_picture;?>" class="img-responsive"> </div> <div class="col-md-6 product_content"> <h4><?php echo ("$product_name");?></h4> <div class="rating"> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> <span class="glyphicon glyphicon-star"></span> </div> <p><?php echo ("$product_detail");?></p> <h3 class="cost">ราคา <?php echo $product_price;?> บาท <small class="pre-cost"></h3> <div class="row"> <div class="col-md-4 col-sm-6 col-xs-12"> <input type=text class="form-control" name="qty" id="qty"> <P>*ระบุจำนวนที่ต้องการ*</P> </div> </div> <div class="space-ten"></div> <div class="btn-ground"> <button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-shopping-cart"></span> ใส่ตะกร้า </button> </div> </div> </div> </div> </div> </div> </div> </body> </html>
data-target="#view<?php echo product_id;?>"
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง