Как запомнить элемент по клику?

Question

[Иван Медведев]

Есть три блока:
1 - оффер
2 - локации зависят от выбранного оффера
3- оффер локации.
Логика: когда юзер выбирает оффер на 1 шаге, он видит локации выбранного оффера. После выбора локации, на 3 шаге ему показываем тот же оффер, что и на 1 шаге, но дополненный информацией с 2 шага.
Все поля вывожу с помощью плагина Carbon fields.

Вопрос: как мне запомнить на 1 шаге, какой оффер был выбран, чтобы вывести правильную инфу на 3 шаге?

<div class="widget_step step_1 active">
      <h3>choose service</h3>
      <ul class="service_list">
        <li class="service_item theme_border">
          <div class="service_info">
            <h4>From widget</h4>
            <ul class="info_list">
              <li class="info_item">From widget</li>
            </ul>
          </div>
          <p class="service_price">&#36;95</p>
        </li>
        <li class="service_item theme_border">
          <div class="service_info">
            <h4>From widget</h4>
            <ul class="info_list">
              <li class="info_item">From widget</li>
            </ul>
          </div>
          <p class="service_price">&#36;100</p>
        </li>
        <li class="service_item theme_border">
          <div class="service_info">
            <h4>From widget</h4>
            <ul class="info_list">
              <li class="info_item">From widget</li>
            </ul>
          </div>
          <p class="service_price">&#36;125</p>
        </li>
      </ul>
    </div>

    <div class="widget_step step_2">
      <h3>your location</h3>
      <ul class="loc_list">
        <li class="loc_item theme_border"><img src="" alt=""><span>From widget</span></li>
      </ul>
    </div>

    <div class="widget_step step_3">
      <h3>Registration</h3>
      <div class="loc_services">
        <h4 class="service_name">Rapid Antigen Test (result in 1 hour)</h4>
        <p class="service_desc">
          Results Within 1 Hour
          Detects SARS-CoV-2 Presence
          Easy & Fast
          Nasal Swab
          FDA Approved
          CLIA-Certified Laboratory
          QR Code
          Fast Turnaround Time
          Results Sent Via Email or SMS
        </p>
        <a class="book register">register now</a>
      </div>
    </div>
    <div class="widget_foot">
      <div class="row row_contacts">
        <div>
          <a href="tel:[phone]" class="phone">1-800-550-2212</a>
          <p class="available">Only Available 7AM - 8PM</p>
        </div>
        <p class="help_text">Need some help?<br>Call us now</p>
      </div>
      <a class="back_btn"></a>
    </div>

Comments

[Артем Золин]

И какой же элемент по вашему можно кликнуть, не считая ссылок? Вам все нужно переверстать в теги <form>, <input>, <label> и т.д.

Answer 1

[ThunderCat]

Вопрос: как мне запомнить на 1 шаге, какой оффер был выбран, чтобы вывести правильную инфу на 3 шаге?

Куки, сессия, как вариант - гет параметры, но это не так удобно.