Ho un progetto jQuery PHP che inserisce la prenotazione di posti a teatro in un db mysql.
Questo è il file js che disegna la mappa e definisce le variabili.
codice:
var price = 0; //price
var $cart = $('#selected-seats'); //Sitting Area
var $counter = $('#counter'); //Votes
var $total = $('#total'); //Total money
var sc = $('#seat-map').seatCharts({
map: [ //Seating chart
'aaaaaaaaaa',
'aaaaaaa__a',
'aaaaaaaaaa',
'aaaaaaaaaa',
'aaaaaaabbb'
],
naming : {
top : true,
rows: ['A','B','C','D','E'],
getLabel : function (character, row, column) {
return column;
}
},
seats:{
a:{
price: 99.9
},
b:{
price: 200
}
},
legend : { //Definition legend
node : $('#legend'),
items : [
[ 'a', 'available', 'Option' ],
[ 'a', 'unavailable', 'Sold']
]
},
click: function () { //Click event
if (this.status() == 'available') { //optional seat
var maxSeats = 3;
var ms = sc.find('selected').length;
//alert(ms);
if (ms < maxSeats) {
price = this.settings.data.price;
$('<option selected>R'+(this.settings.row+1)+' S'+this.settings.label+'</option>')
.attr('id', 'cart-item-'+this.settings.id)
.attr('value', this.settings.id)
.attr('alt', price)
.data('seatId', this.settings.id)
.appendTo($cart);
$counter.text(sc.find('selected').length+1);
$counter.attr('value', sc.find('selected').length+1);
$total.text(recalculateTotal(sc));
$total.attr('value', recalculateTotal(sc));
return 'selected';
}
alert('You can only choose '+ maxSeats + ' seats.');
return 'available';
} else if (this.status() == 'selected') { //Checked
//Update Number
$counter.text(sc.find('selected').length-1);
$counter.attr('value', sc.find('selected').length-1);
//Delete reservation
$('#cart-item-'+this.settings.id).remove();
//update totalnum
$total.text(recalculateTotal(sc));
$total.attr('value', recalculateTotal(sc));
//Delete reservation
//$('#cart-item-'+this.settings.id).remove();
//optional
return 'available';
} else if (this.status() == 'unavailable') { //sold
return 'unavailable';
} else {
return this.style();
}
}
});
function number_format (number, decimals, decPoint, thousandsSep) { // eslint-disable-line camelcase
number = (number + '').replace(/[^0-9+\-Ee.]/g, '')
var n = !isFinite(+number) ? 0 : +number
var prec = !isFinite(+decimals) ? 0 : Math.abs(decimals)
var sep = (typeof thousandsSep === 'undefined') ? ',' : thousandsSep
var dec = (typeof decPoint === 'undefined') ? '.' : decPoint
var s = ''
var toFixedFix = function (n, prec) {
var k = Math.pow(10, prec)
return '' + (Math.round(n * k) / k)
.toFixed(prec)
}
// @todo: for IE parseFloat(0.55).toFixed(0) = 0;
s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.')
if (s[0].length > 3) {
s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep)
}
if ((s[1] || '').length < prec) {
s[1] = s[1] || ''
s[1] += new Array(prec - s[1].length + 1).join('0')
}
return s.join(dec)
}
// Add total money
function recalculateTotal(sc) {
var total = 0;
$('#selected-seats').find('option:selected').each(function () {
total += Number($(this).attr('alt'));
});
return number_format(total,2,'.','');
}
Questo è il file PHP che visualizza la mappa e le variabili in un form.
Codice PHP:
<div class="demo" style="margin-top:10px;min-width: 360px;">
<div id="seat-map">
<div class="front">SCREEN</div>
</div>
<div id="legend"></div>
</div>
<form role="form" id="myfrm2" action="book.php?id=<?php echo $FILM_ID; ?>" method="post">
<input type="hidden" name="session" value="<?php echo $session; ?>">
<input type="hidden" name="date" value="<?php echo $date; ?>">
<select class="form-control" style="display:block;" id="selected-seats" name="seat[]" multiple="multiple"></select>
<p>Tickets: <input id="counter" name="counter" readonly></input></p>
<p>Total: <b>€<input id="total" name="total" readonly></input></b></p>
<button type="submit" style="display: block; width: 100%;" name="book" value="book" class="btn btn-danger">Book</button>
</form>
<?php } ?>
</div>
Tutti i dati sono inseriti in un DB mysql da questo file PHP
Codice PHP:
<?php
if (isset($_POST['book'])) {
$date = $_POST["date"];
$session = $_POST["session"];
$counter = $_POST["counter"];
$total = $_POST["total"];
$user_id = $_SESSION["id"];
$film_id = $_GET['id'];
$seat = (isset($_POST['seat']) ? $_POST['seat']:array());
if (is_array($seat)) {
foreach ($seat as $selectedOption){
$query = "INSERT INTO booking(USER_ID, FILM_ID, BOOKING_SESSION, BOOKING_DATE, BOOKING_SEAT, BOOKING_PRICE, BOOKING_NUM)
VALUES ('$user_id','$film_id','$session','$date','$selectedOption','$total','$counter')";
$result = mysqli_query ($connection,$query)
or die ("<div class='alert alert-danger' role='alert'>You couldn't execute query</div>");
}
echo " <div class='alert alert-success' role='success'>
Congrats your booking has been done! Print the tickets <a href='./fpdf18/generate-pdf.php?film=$film_id' target='_blank'>here</a>!
</div>";
}
}
?>
Tutto funziona correttamente, tutti i dati sono inseriti nel DB !
Ma ora mi occorre aggiungere un nuovo campo al DB (il prezzo di ogni singolo posto SEAT_PRICE) così ho cambiato la <OPTION SELECTED> del codice del JS con questa:
codice:
$('<option selected>R'+(this.settings.row+1)+' S'+this.settings.label+' P'+this.settings.data.price+'</option>')
Adesso il prezzo (nella console è taggato così
) è visibile nella pagina PHP
Ma ho il problema di come inserirlo nel DB.
Ogni suggerimento sarà apprezzato.
Rispondi quotando
