При выборе пункта с выпадающего списка заменить “Выберите способ оплаты” на выбранный!

158
02 июня 2018, 06:40

Не могу решить проблему с выбором пункта! Выбранный пункт не хочет отображаться в начальном окошке, посмотрите в чем может быть проблема и как ее решить!?

$(".x-order-form-row__field").click(function() { 
  $(".x-drop-down__list").toggleClass("x-drop-down__list_active"); 
}); 
$(document).mouseup(function(e) { 
  var $target = $(e.target); 
  if ($target.closest(".x-order-form-row__field").length == 0) { 
    $(".x-drop-down__list").removeClass("x-drop-down__list_active"); 
  } 
}); 
$(document).ready(function() { 
  $('.x-drop-down__list-item').click(function() { 
    $('#payment_option').val($(this).html()); 
  }); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="x-order-form-row"> 
  <div class="x-order-form-row__label">Способ оплаты:</div> 
  <div class="x-order-form-row__field x-order-form-row__field_pos_relative"> 
    <div class="js-toggle x-drop-down" data-qaid="payment_option"> 
      <span class="x-drop-down__value"><span>Выберите способ оплаты</span></span> 
      <span class="x-drop-down__arrow"></span> 
      <input type="hidden" id="payment_option" name="payment_option" value=""> 
      <ul class="x-drop-down__list  js-dropdown"> 
        <li class="x-drop-down__list-item js-item"> 
          <span class="x-drop-down__icon-wrapper"> 
    								<i class="x-drop-down__icon icon-common_payment"></i> 
    							</span> 
          <span class="x-drop-down__text"> 
 
    							<img src="//picsum.photos/25/25" width="25px" alt="альтернативный текст">Безналичный расчет</span> 
        </li> 
        <li class="x-drop-down__list-item js-item"> 
          <span class="x-drop-down__icon-wrapper"> 
    								<i class="x-drop-down__icon icon-common_payment"></i> 
    							</span> 
          <span class="x-drop-down__text"> 
    							<img src="//picsum.photos/25/26" width="25px" alt="альтернативный текст">Наложенный платеж</span> 
        </li> 
      </ul> 
    </div> 
  </div> 
</div>

READ ALSO
Не выходит подключить owlCarousel в проект

Не выходит подключить owlCarousel в проект

Сайт на Laravel, фронт собирается webpack'ом

155
скрыть/показать текст с помощью jquery

скрыть/показать текст с помощью jquery

Всем привет, возможно вопрос и глупый но никак не могу понять одну вещьвот пример html

191
С# WinForms, Окно без рамки, Проблема с BorderTop

С# WinForms, Окно без рамки, Проблема с BorderTop

Убрал системное меню и тайтел у формы, но оставил рамку sizable(для того, чтобы можно было изменять размер)

156
Что такое Interface в C#? [дубликат]

Что такое Interface в C#? [дубликат]

На данный вопрос уже ответили:

185