[英]Pass jquery consult to variable php
I'm doing a page where you can choose the chair you seat on, sort of like a bus seat system, I did a JQuery sentence in order to identify the chair, and i want to pass the identifier to PHP as a dynamic value.我正在做一个页面,您可以在其中选择您所坐的椅子,有点像公共汽车座位系统,我做了一个 JQuery 句子来识别椅子,我想将标识符作为动态值传递给 PHP。 is there a way to do it?有办法吗?
My partyroom code:我的宴会厅代码:
<?php
session_start();
?>
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<p class="instructions"> Choose your seat</p>
<div class="hipermain">
<section class="party">
<section class="table-container">
<img onclick="checker()" src="img/table.png" alt="table" class="table">
<img onclick="checker()" src="img/chair-available.png" alt="chair" class="chair pos1">
<img onclick="checker()" src="img/chair-available.png" alt="chair" class="chair pos2">
<img onclick="checker()" src="img/chair-available.png" alt="chair" class="chair pos3">
<img onclick="checker()" src="img/chair-available.png" alt="chair" class="chair pos4">
<img onclick="checker()" src="img/chair-available.png" alt="chair"
</div>
<script>
async function getChairs(){
let url = "code/chairs.php";
await fetch(url)
.then(response=>response.json())
.then(data=>{
console.log();
data.forEach(chair=>{
console.log(".pos"+chair.id);
var $refChair=$(".pos" + chair.id);
$refChair.attr("src","img/chair-occupied.png");
$refChair.attr("data-bs-toggle",".popover");
$refChair.attr("title","This chair is occupied by: ");
$refChair.attr("data-bs-content", chair.name);
new bootstrap.Popover($refChair);
console.log(chair.id)
});
})
}
getChairs()
</script>
<script>
$(".chair").on("click",function(){
console.log($(this).attr("class"))
});
function checker(){
var result = confirm('You have chosen a chair you want to proceed to check out? ');
if (result == true){
window.location.href = "paymethod.php";
}
}
</script>
</body>
</html>
As i said, is there a way to just take the number of the chair being selected and take it to a variable to use it as a chair identifier?正如我所说,有没有一种方法可以只获取被选中的椅子的编号并将其作为一个变量来用作椅子标识符?
You are already using the Fetch API with fetch()
so simply use it again to post the selected chair to your PHP script?您已经在使用带有fetch()
的 Fetch API,所以只需再次使用它来将选定的椅子发布到您的 PHP 脚本?
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
Here is another link that explain how to use the Fetch API to send a POST request: POST Request with Fetch API?这是另一个解释如何使用Fetch API发送POST请求的链接: POST Request with Fetch API?
If you don't want to use the Fetch API, you could still use XMLHttpRequest as described here: http://vanilla-js.com/如果您不想使用 Fetch API,您仍然可以按照此处所述使用XMLHttpRequest : http://vanilla-js.com/
Add the chair number as a data attribute of the element.添加椅子编号作为元素的数据属性。 Then you can get it with .data()
and use this in the click handler.然后您可以使用.data()
获取它并在点击处理程序中使用它。
$(".chair").on("click", function() { console.log($(this).data("chair")) });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <section class="table-container"> <img src="img/table.png" alt="table" class="table"> <img src="img/chair-available.png" alt="chair" class="chair" data-chair="1"> <img src="img/chair-available.png" alt="chair" class="chair" data-chair="2"> <img src="img/chair-available.png" alt="chair" class="chair" data-chair="3"> <img src="img/chair-available.png" alt="chair" class="chair" data-chair="4"> </section>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.