我正在尝试获取此值并在php上获取它:
$cart = $('#selected-seats')
这是代码:
var price = <?php $price = 400; echo $price;?>; //price
$(document).ready(function() {
var $cart = $('#selected-seats'), //Sitting Area
$counter = $('#counter'), //Votes
$total = $('#total'); //Total money
var sc = $('#seat-map').seatCharts({
map: [ //Seating chart
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aa_aa',
'aaaaa',
],
naming : {
top : false,
getLabel : function (character, row, column) {
return column;
}
},
legend : { //Definition legend
node : $('#legend'),
items : [
[ 'a', 'available', 'Option' ],
[ 'a', 'unavailable', 'Sold']
]
},
click: function () { //Click event
if (this.status() == 'available') { //optional seat
$('<li>'+(this.settings.row+1)+'_'+this.settings.label+'</li>')
.attr('id', 'cart-item-'+this.settings.id)
.data('seatId', this.settings.id)
.appendTo($cart);
$counter.text(sc.find('selected').length+1);
$total.text(recalculateTotal(sc)+price);
return 'selected';
} else if (this.status() == 'selected') { //Checked
//Update Number
$counter.text(sc.find('selected').length-1);
//update totalnum
$total.text(recalculateTotal(sc)-price);
//Delete reservation
$('#cart-item-'+this.settings.id).remove();
//optional
return 'available';
} else if (this.status() == 'unavailable') { //sold
return 'unavailable';
} else {
return this.style();
}
}
});
//sold seat
sc.get([]).status('unavailable');
});
//sum total money
function recalculateTotal(sc) {
var total = 0;
sc.find('selected').each(function () {
total += price;
});
return total;
}
</script>
这是我的HTML代码:
<div class="container">
<div class="row">
<div class="col-md-7">
<br>
<div class="demo">
<div id="seat-map">
</div>
<div class="booking-details">
<p>Time: <span>November 3, 21:00</span></p>
<p>Seat: </p>
<ul id="selected-seats"></ul>
<p>No of Seats: <span id="counter">0</span></p>
<p>Total: <b>P<span id="total">0</span></b></p>
<br>
<button type="button" class="btn btn-custom" name="book" onclick="book();">Book</button>
<div id="legend"></div>
</div>
<div style="clear:both">
</div>
<div id="result"></div>
</div>
</div>
</div>
</div>
如何获取$ cart的值并在php中获取该值?
我刚才使用jquery并且没有使用ajax的背景,请帮忙。
答案 0 :(得分:0)
var getLiData = [];
$("ul li").each(function(){
getLiData.push($(this).html());
});
然后将其发送到带有Ajax
请求的回调php文件
答案 1 :(得分:0)
您需要在接受JSON字符串的服务器端(PHP)上创建一个端点,然后从客户端(Javascript)通过AJAX发送数据
对于Exmaple:
服务器端(PHP)
<?php
$payload = file_get_contents('php://input');
$request = json_decode($payload);
//TODO: Your handling logic here
// Accessing the array by $request->{'selectedSeats'}
$rsp = array('success'=>true);
echo json_encode($rsp);
?>
客户端(Javascript)
var request = {
selectedSeats: []
};
$("#selected-seats li").each(function(){
request.selectedSeats.push($(this).html());
});
$.ajax({
method: "POST",
url: "api.php",
data: request,
success: function(rsp){
if(rsp.success){
alert("Success");
}else{
alert("Fail");
}
},
error: function(){
alert("Fail");
}
});
答案 2 :(得分:0)
首先让我回答你的问题..
这将为您提供所选座位ID的数组:
var seatsInCart = $cart.children().map(function(i, el) { return $(el).data('seatId') })
然后您可以通过Ajax发布您的数据,如下所示:
$.post("cart.php", { seats: seatsInCart })
.done(
function(data) {
alert("Response from server: " + data);
}
);
然而,为什么你不是只是存储座位ID - 或者你将使用什么来识别所选座位 - 在javascript变量中选择它?从DOM中提取它是不必要的复杂。
然后更好的是根据该数组呈现席位列表。否则你可能很快就会发现自己处于混乱的jQuery DOM操作中,这些操作非常脆弱,每次碰到任何东西都会破坏。
查看http://knockoutjs.com/,这是一个很好的工具,可以轻松理解这些用例。如果你觉得特别大胆,你甚至可以考虑在这里使用ReactJS。