Question

想象一下，我的room_table中有3个数据，列为room_id, image, room_name，然后我将在我的html代码中显示room_table的数据。

PS：首先忽略text_checkin, text_checkout。我将在代码之后解释。

HTML code：

$db = mysqli_connect('xxxxxx', 'xxxx', '', 'xxxx');
$rooms = mysqli_query($db, "SELECT * FROM rooms ORDER BY id ASC;");

<script src = "http://code.jquery.com/jquery-1.9.1.js"></script>
<?php while($row = mysqli_fetch_array($rooms)) { ?>
   <div>
    <form >
            <img src="upload/<?php echo $row['image']; ?>" style="width: 20%;">
            <label>Check IN</label>
            <input type="date" name="text_checkin" id="text_checkin">
            <br>
            <label>Check OUT</label>
            <input type="date" name="text_checkout" id="text_checkout">
            <br>
            <label>Room ID</label>
            <input type="text" name="text_roomid" id="text_roomid" value="<?php echo $row['id']; ?>">
            <br>
            <input type="submit" value="submit" name="submit" id="submit" onclick="return chk()">
            <br><br><br>
    </form>
    <p id="msg"></p>
   </div>
<?php } ?>

我有一个名为reservation的表，然后列是room_id, checkin, checkout。

我的room_table中的3个数据将会显示。然后文本框和按钮将是while循环的三倍原因。然后想象一下，我点击了第二行中的按钮submit，然后第二行id应该插入到我的表reservation上，但问题是只插入第一行id表reservation

这是我的剧本：

<script type="text/javascript">
function chk()
{
var roomid = document.getElementById('text_roomid').value;
var checkin = document.getElementById('text_checkin').value; 
var checkout = document.getElementById('text_checkout').value;
var dataString = 'roomid='+ roomid + '&checkin=' + checkin + '&checkout=' + checkout;
$.ajax({
  type: "post",
  url: "server.php",
  data:dataString,
  cache:false,
  success: function(html){
    $('#msg').html("success"); 
  }
});
return false;
  }

  </script>

PHP代码：server.php

    $roomid = $_POST['roomid'];
    $checkin = $_POST['checkin'];
    $checkout = $_POST['checkout'];

    $query = "INSERT INTO reservation (room_id, checkin, checkout) values ('$roomid', '$checkin', '$checkout')";
    mysqli_query($db, $query);
    echo "success!";

请帮我解决这个问题，tyia！

Answer 1

错误在于while循环。您的打印元素都具有相同的ID。当你的函数正在寻找一个id来获取值时，它将始终返回它找到的第一个，无论该id有多少个实例。因此，您的身份存在冲突。 id应始终是唯一的。

你可以做些什么来避免这种情况，就是在你的while循环之外声明一个计数器并在你的while循环中增加它，然后将它附加到你的id上。这样，您将始终拥有一个唯一的ID来解析。

例如：

<?php $count=0; while($row = mysqli_fetch_array($rooms)) { $count++;?>
   <div>
    <form >
            <img src="upload/<?php echo $row['image']; ?>" style="width: 20%;">
            <label>Check IN</label>
            <input type="date" name="text_checkin" id="text_checkin<?php echo $count; ?>">
            <br>
            <label>Check OUT</label>
            <input type="date" name="text_checkout" id="text_checkout<?php echo $count; ?>">
            <br>
            <label>Room ID</label>
            <input type="text" name="text_roomid" id="text_roomid<?php echo $count; ?>" value="<?php echo $row['id']; ?>">
            <br>
            <input type="submit" value="submit" name="submit" id="submit" onclick="return chk()">
            <br><br><br>
    </form>
    <p id="msg<?php echo $count; ?>"></p>
   </div>
<?php } ?>

但是，您需要更改逻辑以获取从每个元素获取数据的方式，因为您并不真正知道他们的ID最终可能是由于增量器而导致的。这不是一成不变的。

如果您需要任何进一步的帮助，请与我们联系。

Answer 2

正如Martin所说，id存在问题所以你必须稍微改变一下逻辑。

$db = mysqli_connect('xxxxxx', 'xxxx', '', 'xxxx');
$rooms = mysqli_query($db, "SELECT * FROM rooms ORDER BY id ASC;");

<script src = "http://code.jquery.com/jquery-1.9.1.js"></script>
<?php while($row = mysqli_fetch_array($rooms)) { ?>
   <div>
    <form >
            <img src="upload/<?php echo $row['image']; ?>" style="width: 20%;">
            <label>Check IN</label>
            <input type="date" name="text_checkin" class="text_checkin">
            <br>
            <label>Check OUT</label>
            <input type="date" name="text_checkout" class="text_checkout">
            <br>
            <label>Room ID</label>
            <input type="text" name="text_roomid" class="text_roomid" value="<?php echo $row['id']; ?>">
            <br>
            <input type="submit" value="submit" name="submit" id="submit" onclick="return chk()">
            <br><br><br>
    </form>
    <p id="msg"></p>
   </div>
<?php } ?>

然后，您可以单独获取值并将它们作为数组传递给服务器。

<script type="text/javascript">
function chk()
{

var roomidArr = $(".text_roomid");
var checkinArr = $(".text_checkin");
var checkoutArr = $(".text_checkout");

/*
  You can get value of each element as;

  for(var i = 0; i < roomidArr.length; i++){
    console.log($(roomidArr[i]).val());
}
*/
//var dataString = Apply your logic here as;
$.ajax({
  type: "post",
  url: "server.php",
  data:dataString,
  cache:false,
  success: function(html){
    $('#msg').html("success"); 
  }
});
return false;
  }

  </script>

使用JQUERY和PHP插入数据

2 个答案: