當我點擊按鈕「點擊我」,所選擇的ID將打印的var divtest
然後在<div id="container">
淡出,當我按下另一個按鈕「點擊我」吧只獲取第一個ID,但我想要的只是數據庫中顯示的第二個ID。如果我嘗試刪除選定的描述,它將返回到ID描述的容器。獲取信息的JavaScript
我的數據庫樣本。
ID Description
1 Hello
2 Hi
3 Thank You
這是我的示例代碼。
<?php
$conn = mysqli_connect("localhost", "root", "","dblaquaresort") or die("Failed to Connect");
$sql = "SELECT * FROM tblsample";
$query = mysqli_query($conn, $sql);
while ($sample = mysqli_fetch_array($query))
{
?><div id="container">
<label id="ID">ID: <?php echo $sample['ID']; ?></label>
<label id="Description">Description: <?php echo $sample['Description']; ?></label>
<button type="button" id="more_fields" onclick="add_fields();">Click me</button> </div>
<?php
}
?>
<div id="room_fileds">
<div>
<div class="content">
<?php
function not_empty_string($s)
{
return $s !== " ";
}
$pieces = array_filter(explode(",", "Test"),'not_empty_string');
foreach ($pieces as $piece)
{
$test_stinga = array_filter(explode("-", $piece),'not_empty_string');
$test_stinga=preg_replace('/\s+/', '', $test_stinga);
}
?>
</div>
</div>
</div>
<script>
var room = 1;
var wrapper = $(".testtt");
function add_fields()
{
room++;
var objTo = document.getElementById('room_fileds');
var ID = document.getElementById('ID').innerHTML;
var Desc = document.getElementById('Description').innerHTML;
var divtest = document.createElement("div");
divtest.innerHTML = '<div class="label">TEST ' + room + ':</div> <div class="content"><span><p class="form-inline">Testing: '+ ID +'</span><span>Description: ' + Desc + '</span><button class="remove"> Remove</button></p></div>';
objTo.appendChild(divtest)
}
$('#room_fileds').on("click",".remove", function(e)
{
$(this).parents().eq(5).remove();
})
</script>
這是我想要的輸出。
Div Container
ID: 1 Description: Hello <button>click me</button>
ID: 2 Description: Hi <button>click me</button>
ID: 3 Description: Thank You <button>click me</button>
如果我點擊ID = 2
Div Container
ID: 1 Description: Hello <button>click me</button>
ID: 3 Description: Thank You <button>click me</button>
Divtest
ID: 2 Description: Hi <button>Remove</button>
如果我點擊刪除就回去的div容器。
ID: 1 Description: Hello <button>click me</button>
ID: 2 Description: Hi <button>click me</button>
ID: 3 Description: Thank You <button>click me</button>