简体   繁体   中英

JavaScript - How to pass/store value from function to form hidden field?

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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM