html中的正確選項之后的空白選項
[英]Blank options following Correct options in html select
問題描述
我創建了一個選擇選項，並使用數據庫中的mysqli查詢填充了它。 但是，下拉菜單中正確選項下面有空白選項。 這是我的帶有選擇選項的php頁面：
<!DOCTYPE html>
<!DOCTYPE html>
<?php
include("includes/connect.php");
function getcats_add_products(){
global $con;
$get_cats="select * from categories";
$run_cats=mysqli_query($con, $get_cats);
echo "<option>Select Category</option>";
while($row_cats = mysqli_fetch_array($run_cats)){
$cat_id = $row_cats['cat_id'];
$cat_title = $row_cats['cat_title'];
echo "<option value='$cat_id'>$cat_id, $cat_title<option>";
}
}
?>
<html>
<head>
<title>Admin Panel - Add Products</title>
<link rel="stylesheet" type="text/css" href="styles/admin-style.css">
</head>
<body>
<header class="header">
</header>
<div class="heading">Add New Product</div>
<div class="product-table-div">
<form>
<table class="product-table">
<tr>
<td>Product Category</td>
<td>
<select id="product-table-input" >
<?php getcats_add_products(); ?>
</select>
</td>
</tr>
<tr>
<td>Product Brand</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product title</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product Price</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product description</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product image</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product Keywords</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td colspan="2">
<div id="product-submit-div">
<input type="submit" name="submit" id="product-submit" value="Add">
</div>
</td>
</tr>
</table>`enter code here`
</form>
</div>
<?php getcats_add_products(); ?>
</body>
</html>
這是css文件：
header {
height: 100px;
background: #006b00; /* For browsers that do not support gradients */
background: -webkit-linear-gradient(#006b00, #00fa00); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(#006b00, #00fa00); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#006b00, #00fa00); /* For Firefox 3.6 to 15 */
background: linear-gradient(#006b00, #00fa00);
}
.heading {
margin: 20px;
text-align: center;
width: 100%;
color: #001A00;
font-size: 25px;
font-weight: bold;
}
.product-table-div {
width: fit-content;
margin: auto;
display: block;
}
.product-table {
table-layout: auto;
height: auto;
background-color: #00CC8A;
}
.product-table td {
font-size: 20px;
text-align: left;
}
#product-submit-div {
text-align: center;
max-width: 100%;
}
#product-submit {
border: 0px;
height: 100%;
width: 30%;
line-height: 20px;
font-size: 20px;
border-radius: 3px;
}
這是我的連接頁面：
<?php
$con = mysqli_connect("localhost", "root", "root", "ecommerce");
if(!$con){
die('connection error: '.$mysqli->connect_error());
}
?>
這是在填充數據后選擇選項的外觀： 選擇選項后跟空格
這是我要查詢的表： 數據庫表
我不能確定這是mysql問題還是css問題。 空格不在第一個標簽和第二個標簽之間。 在我從數據庫中拉出的標簽之后，只有空白選項。
2 個解決方案
解決方案1
2 已采納 2016-10-11 17:09:05
您缺少結束標記，因此，每個選項后都會有額外的空白空間。
echo "<option value='".$cat_id."'>".$cat_title."</option>";
這就是為什么每個選擇選項后都會出現空行的原因。
解決方案2
0 2016-10-11 17:08:25
您已經兩次添加了HTML文檔的“開始”，並且不建議這樣做，並且必須將其從代碼中刪除。
刪除您添加<!DOCTYPE html>兩次
在選擇標記中不顯示選項的原因：
您尚未將字符串正確連接到已添加到select標簽上的回顯上。 因此，您的選擇標記將不會在選項值中顯示任何值，並且您需要像這樣更改整個功能才能將值顯示在選項標記中。
除了使用的
mysqli_fetch_array()可以使用mysqli_fetch_assoc()你可以在while循環時間得到單列，使您可以根據需要修改數據。 就像您需要對mysqli_fetch_array()。
-
mysqli_fetch_array()-方法
PHP代碼：
<?php
include("includes/connect.php");
function getcats_add_products(){
global $con;
$get_cats="select * from categories";
$run_cats=mysqli_query($con, $get_cats);
echo "<option>Select Category</option>";
while($row_cats = mysqli_fetch_array($run_cats)){
$cat_id = $row_cats['cat_id'];
$cat_title = $row_cats['cat_title'];
echo "<option value=".$cat_id.">".$cat_title."<option>";
}
}
?>
-
mysqli_fetch_assoc()-方法
PHP代碼：
<?php
include("includes/connect.php");
function getcats_add_products(){
global $con;
$get_cats="select * from categories";
$run_cats=mysqli_query($con, $get_cats);
echo "<option>Select Category</option>";
while($row_cats = mysqli_fetch_assoc($run_cats)){
$cat_id = $row_cats['cat_id'];
$cat_title = $row_cats['cat_title'];
echo "<option value=".$cat_id.">".$cat_title."<option>";
}
}
?>
注意：兩者都將遵循循環結構的相同方法，以便您可以決定使用哪種方法，並且兩者都與顯示輸出時所看到的相同。
但是，請注意上述代碼中的級聯方式，您必須單獨這樣做。
並且以默認方式，您必須在選項值中傳遞ID或值，然后在選項值的外部傳遞另一個參數。
更換：
echo "<option value='$cat_id'>$cat_id, $cat_title<option>";
附：
echo "<option value=".$cat_id.">".$cat_title."<option>";
希望我的解釋會很清楚，您可以為將來的目的進行更正。
快樂編碼:)
PHP數組空白選擇選項
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.