Please, Im having an issue with the JavaScript below. I'm not very used to JavaScript... what I have below is a ticket booking script that displays the number of tickets selected, total amount and seat row / seat number. I want to pick the number of ticket, seat row, seat number ( for all the selected seat e,g 3,5 and 8,2 means row 3 seat 5 and row 8 seat 2) and amount in the HTML form HIDDEN FIELD as shown somewhere in the code and then send these values to another page through the submit button and then get them by PHP.
<div class="booking-details">
<ul class="book-left">
<li>Time </li>
<li>Tickets</li>
<li>Total</li>
<li>Seats :</li>
</ul>
<ul class="book-right">
<li>: April 3, 21:00</li>
<li>: <span id="counter">0</span></li>
<li>: <b><i>$</i><span id="total">0</span></b></li>
</ul>
<div class="clear"></div>
<ul id="selected-seats" class="scrollbar scrollbar1"></ul>
<!-- HTML FORM WHERE HIDDEN INPUT IS LOCATED TO GET THE VARIABLES -->
<div id="legend"></div>
</div>
<div style="clear:both"></div>
</div>
<script type="text/javascript">
var price = 52; //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
'aaaaaaaaaa',
'aaaaaaaaaa',
'__________',
'aaaaaaaa__',
'aaaaaaaaaa',
'aaaaaaaaaa',
'aaaaaaaaaa',
'aaaaaaaaaa',
'aaaaaaaaaa',
'__aaaaaa__'
],
naming : {
top : false,
getLabel : function (character, row, column) {
return column;
}
},
legend : { //Definition legend
node : $('#legend'),
items : [
[ 'a', 'available', 'Available' ],
[ 'a', 'unavailable', 'Sold'],
[ 'a', 'selected', 'Selected']
]
},
click: function () { //Click event
if (this.status() == 'available') { //optional seat
$('<li>Row'+(this.settings.row+1)+' Seat'+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(['', '4_4','4_5','6_6','6_7','8_5','8_6','8_7','8_8', '10_1', '10_2']).status('unavailable');
});
//sum total money
function recalculateTotal(sc) {
var total = 0;
sc.find('selected').each(function () {
total += price;
});
return total;
}
</script>
</div>
如果必须将值传递给隐藏输入,可以像这样设置值:
$("#price").val(total);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.