Каков наилучший способ использования функций jquery для хранения 4 переменных из массива, доступных другому paage

#jquery-ui #variables #jquery #javascript

#jquery-ui #переменные #jquery #javascript

Вопрос:

Привет всем, я пытаюсь разработать процесс выбора места / оформления заказа для сайта. Расположение соответствует расположению шины.

Структура моего окончательного кода была бы такой:

     $(document).ready(function(){
    $('#search').submit(function()
    {
        //get date, location value from search inputs and send via ajax to a php script for query
        //search.php queries MySQL database
        //each result is put in seperate div that displays bus info and appended to a #main div
       //when user clicks on RSVP button a seat picker(unordered list of seats) pops up in modal box
       //When user selects seat and clicks confirm button, the client info and INDIVIDUAL bus info are stored in a guest list database 
    }

    });
  

Каков наилучший способ сохранить конкретную информацию о шине, такую как время, дата, местоположение, выбранное место, соответствующее тому, которое выбирает пользователь?

     $(document).ready(function() {

    $('#search1').submit(function(){

            $.ajax({
        type: "POST",
        cache: "true",
        url: "search.php",
        dataType:"json",
        data: datastring,
        success: function(data){

                for ($i = 0, $j = data.bus.length; $i < $j; $i  ) {


                        var html = '<div id="'   data.bus[$i].number   '">';
                html  = '<div id="bus_num">'   '<b>BUS #</b>'   data.bus[$i].number   '</div>';
                html  = '<div id="bus_graphic"></div>';
                html  = '<div id="capacity">'   '<h1>Capacity</h1>'   data.bus[$i].capacity   '</div>';
                html  = '<div id="time">'   '<h1>Departure</h1>'   data.bus[$i].time   '</div>';
                html  = '<div id="seats">'   '<h1>Open Seats</h1>'   data.bus[$i].seats   '</div>';
                html  = '<div id="price">$'   price   '</div>';
                html  = '<a class="rsvp" href="#rsvp">RSVP</a>';
                html  = '</div>';
                $('#main').append(html);

              }


            $("a.rsvp").button();
            $(".rsvp").colorbox({width:"700px", inline:true, href:"#rsvp"});
                }
    });
    return false;
});
  

});

селектор места, который появляется в модальном окне:

     <ul id="airplane">

    <li class="seat_01 A"><a href="#row_01" title="01A">01A</a></li>
    <li class="seat_01 B"><a href="#row_01" title="01B">01B</a></li>
    <li class="seat_01 C"><a href="#row_01" title="01C">01C</a></li>
    <li class="seat_01 D"><a href="#row_01" title="01D">01D</a></li>

    <li class="seat_02 A"><a href="#row_02" title="02A">02A</a></li>
    <li class="seat_02 B"><a href="#row_02" title="02B">02B</a></li>
    <li class="seat_02 C"><a href="#row_02" title="02C">02C</a></li>
    <li class="seat_02 D"><a href="#row_02" title="02D">02D</a></li>

    <li class="seat_03 A"><a href="#row_03" title="03A">03A</a></li>
    <li class="seat_03 B"><a href="#row_03" title="03B">03B</a></li>
    <li class="seat_03 C"><a href="#row_03" title="03C">03C</a></li>
    <li class="seat_03 D"><a href="#row_03" title="03D">03D</a></li>

    <li class="seat_04 A"><a href="#row_04" title="04A">04A</a></li>
    <li class="seat_04 B"><a href="#row_04" title="04B">04B</a></li>
    <li class="seat_04 C"><a href="#row_04" title="04C">04C</a></li>
    <li class="seat_04 D"><a href="#row_04" title="04D">04D</a></li>

    <li class="seat_05 A"><a href="#row_05" title="05A">05A</a></li>
    <li class="seat_05 B"><a href="#row_05" title="05B">05B</a></li>
    <li class="seat_05 C"><a href="#row_05" title="05C">05C</a></li>
    <li class="seat_05 D"><a href="#row_05" title="05D">05D</a></li>

    <li class="seat_06 A"><a href="#row_06" title="06A">06A</a></li>
    <li class="seat_06 B"><a href="#row_06" title="06B">06B</a></li>
    <li class="seat_06 C"><a href="#row_06" title="06C">06C</a></li>
    <li class="seat_06 D"><a href="#row_06" title="06D">06D</a></li>

    <li class="seat_07 A"><a href="#row_07" title="07A">07A</a></li>
    <li class="seat_07 B"><a href="#row_07" title="07B">07B</a></li>
    <li class="seat_07 C"><a href="#row_07" title="07C">07C</a></li>
    <li class="seat_07 D"><a href="#row_07" title="07D">07D</a></li>

    <li class="seat_08 A"><a href="#row_08" title="08A">08A</a></li>
    <li class="seat_08 B"><a href="#row_08" title="08B">08B</a></li>
    <li class="seat_08 C"><a href="#row_08" title="08C">08C</a></li>
    <li class="seat_08 D"><a href="#row_08" title="08D">08D</a></li>

    <li class="seat_09 A"><a href="#row_09" title="09A">09A</a></li>
    <li class="seat_09 B"><a href="#row_09" title="09B">09B</a></li>
    <li class="seat_09 C"><a href="#row_09" title="09C">09C</a></li>
    <li class="seat_09 D"><a href="#row_09" title="09D">09D</a></li>

    <li class="seat_10 A"><a href="#row_10" title="10A">10A</a></li>
    <li class="seat_10 B"><a href="#row_10" title="10B">10B</a></li>
    <li class="seat_10 C"><a href="#row_10" title="10C">10C</a></li>
    <li class="seat_10 D"><a href="#row_10" title="10D">10D</a></li>

    <li class="seat_11 A"><a href="#row_11" title="11A">11A</a></li>
    <li class="seat_11 B"><a href="#row_11" title="11B">11B</a></li>
    <li class="seat_11 C"><a href="#row_11" title="11C">11C</a></li>
    <li class="seat_11 D"><a href="#row_11" title="11D">11D</a></li>

    <li class="seat_12 A"><a href="#row_12" title="12A">12A</a></li>
    <li class="seat_12 B"><a href="#row_12" title="12B">12B</a></li>
    <li class="seat_12 C"><a href="#row_12" title="12C">12C</a></li>
    <li class="seat_12 D"><a href="#row_12" title="12D">12D</a></li>

    <li class="seat_13 A"><a href="#row_13" title="13A">13A</a></li>
    <li class="seat_13 B"><a href="#row_13" title="13B">13B</a></li>
    <li class="seat_13 C"><a href="#row_13" title="13C">13C</a></li>
    <li class="seat_13 D"><a href="#row_13" title="13D">13D</a></li>

    <li class="seat_14 A"><a href="#row_14" title="14A">14A</a></li>
    <li class="seat_14 B"><a href="#row_14" title="14B">14B</a></li>
    <li class="seat_14 C"><a href="#row_14" title="14C">14C</a></li>
    <li class="seat_14 D"><a href="#row_14" title="14D">14D</a></li>

    <li class="seat_15 A"><a href="#row_15" title="15A">15A</a></li>
    <li class="seat_15 B"><a href="#row_15" title="15B">15B</a></li>
    <li class="seat_15 C"><a href="#row_15" title="15C">15C</a></li>
    <li class="seat_15 D"><a href="#row_15" title="15D">15D</a></li>

    <li class="seat_16 A"><a href="#row_16" title="16A">16A</a></li>
    <li class="seat_16 B"><a href="#row_16" title="16B">16B</a></li>
    <li class="seat_16 C"><a href="#row_16" title="16C">16C</a></li>
    <li class="seat_16 D"><a href="#row_16" title="16D">16D</a></li>

    <li class="seat_17 A"><a href="#row_17" title="17A">17A</a></li>
    <li class="seat_17 B"><a href="#row_17" title="17B">17B</a></li>
    <li class="seat_17 C"><a href="#row_17" title="17C">17C</a></li>
    <li class="seat_17 D"><a href="#row_17" title="17D">17D</a></li>

    <li class="seat_18 A"><a href="#row_18" title="18A">18A</a></li>
    <li class="seat_18 B"><a href="#row_18" title="18B">18B</a></li>
    <li class="seat_18 C"><a href="#row_18" title="18C">18C</a></li>
    <li class="seat_18 D"><a href="#row_18" title="18D">18D</a></li>

    <li class="seat_19 A"><a href="#row_19" title="19A">19A</a></li>
    <li class="seat_19 B"><a href="#row_19" title="19B">19B</a></li>
    <li class="seat_19 C"><a href="#row_19" title="19C">19C</a></li>
    <li class="seat_19 D"><a href="#row_19" title="19D">19D</a></li>

    <li class="seat_20 A"><a href="#row_20" title="20A">20A</a></li>
    <li class="seat_20 B"><a href="#row_20" title="20B">20B</a></li>
    <li class="seat_20 C"><a href="#row_20" title="20C">20C</a></li>
    <li class="seat_20 D"><a href="#row_20" title="20D">20D</a></li>

    <li class="seat_21 A"><a href="#row_21" title="21A">21A</a></li>
    <li class="seat_21 B"><a href="#row_21" title="21B">21B</a></li>
    <li class="seat_21 C"><a href="#row_21" title="21C">21C</a></li>
    <li class="seat_21 D"><a href="#row_21" title="21D">21D</a></li>

    <li class="seat_22 A"><a href="#row_22" title="22A">22A</a></li>
    <li class="seat_22 B"><a href="#row_22" title="22B">22B</a></li>
    <li class="seat_22 C"><a href="#row_22" title="22C">22C</a></li>
    <li class="seat_22 D"><a href="#row_22" title="22D">22D</a></li>

    <li class="seat_23 A"><a href="#row_23" title="23A">23A</a></li>
    <li class="seat_23 B"><a href="#row_23" title="23B">23B</a></li>
    <li class="seat_23 C"><a href="#row_23" title="23C">23C</a></li>
    <li class="seat_23 D"><a href="#row_23" title="23D">23D</a></li>

    <li class="seat_24 A"><a href="#row_24" title="24A">24A</a></li>
    <li class="seat_24 B"><a href="#row_24" title="24B">24B</a></li>
    <li class="seat_24 C"><a href="#row_24" title="24C">24C</a></li>
    <li class="seat_24 D"><a href="#row_24" title="24D">24D</a></li>

    <li class="seat_25 A"><a href="#row_25" title="25A">25A</a></li>
    <li class="seat_25 B"><a href="#row_25" title="25B">25B</a></li>
    <li class="seat_25 C"><a href="#row_25" title="25C">25C</a></li>
    <li class="seat_25 D"><a href="#row_25" title="25D">25D</a></li>
</ul>
<!-- end #airplane -->
    <p>
        <input type="submit" value="BOOK" class="button" id="book" />
    </p>
  

Ответ №1:

Если вы хотите, чтобы они были доступны на других страницах, я рекомендую сохранить их в базе данных.

Если вы новичок в базах данных, попробуйте это руководство: MySQL от Tizag