Insert data in DataBase - Using jQuey Seat Chart plugin

Insert data in DataBase - Using jQuey Seat Chart plugin

I use an adaptation of this plugin jQuery Seat Chart

Here it is some lines:

  1.    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();
         
    }
         
    }
       
    });

I have changed $('<option selected>...) like this

  1. $('<option selected>R'+(this.settings.row+1)+' S'+this.settings.label+' P'+this.settings.data.price+'</option>')

that is, I insert a new figure: "price". Ok. This selction works properly.

I store all the data in a DB MySql using PHP page

  1. <?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>"
    ;
         }
         
        } 
        
    ?>

The question is how to store the PRICE variable to the DB (field SEAT_PRICE)?

This is a screenshot of the HTML inspector