Вставить в input значение введенное ранее

Question

Есть поля

<input type="text" name="name" id="name">
<input type="text" name="surname" id="surname">

Также есть три radio кнопки

<input type="radio" name="shippingMethod" value="sdek" class="shippingMethod">
<input type="radio" name="shippingMethod" value="rupost" class="shippingMethod">
<input type="radio" name="shippingMethod" value="pickup" class="shippingMethod">

Пытаюсь сделать так чтобы если выбран pickup, то в поля name и surname вставить текст "самовывоз" и, при этом, сохранить введенные данные до выбора pickup чтобы если дальше будет выбран не pickup, то вставить в name и surname ранее введенные данные.

$(document).on('change', '.shippingMethod', function(){

if($(this).val() == 'pickup'){

var name = $(document).find('#name').val(), //переменная со значением до того как установить значение "самовывоз"
surname = $(document).find('#surname').val(), //переменная со значением до того как установить значение "самовывоз"

$(document).find('#name, #surname').val('Самовывоз');
}

else{

$(document).find('#name').val(name);
$(document).find('#surname').val(surname);


}

)};

Проблема - не вставляются ранее введенные значения (var name, surname) если после клика на pickup кликаю на кнопку .shippingMethod с другим значением (sdek/rupost). Поля тупо очищаются (или вставляются пустые значения).

Answer 1

Надо сохранять введенные значения. Проще всего, наверное, при их непосредственном изменении.
Когда меняете галку, вытаскивайте эти сохраненные.

$(".fio").keyup(function(){
  $(this).data('value', $(this).val() );
});

$(".shippingMethod").change(function(){
  let v = $(this).val();
  console.log(v);
  
  if(v == 'pickup'){
    $(".fio").val("самовывоз")
  }
  else {
    $(".fio").each(function(){
       $(this).val( $(this).data('value') );
    });
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" name="name" id="name" class="fio">
<input type="text" name="surname" id="surname" class="fio">

<input type="radio" name="shippingMethod" value="sdek" class="shippingMethod">
<input type="radio" name="shippingMethod" value="rupost" class="shippingMethod">
<input type="radio" name="shippingMethod" value="pickup" class="shippingMethod">

БЛОГ НА HUSL

Вставить в input значение введенное ранее

Ответы (1 шт):