Как я могу восстановить исходные значения параметров выбора при успехе AJAX?

Question

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

Вот как я изменяю команду выбора при отправке.

  jQuery("select option").val(function(){
    return $(this).text();
  });

PS Я не могу использовать location.reload ();

Answer 1

Вы можете сохранить значения, используя .data(), а затем восстановить их, когда вам нужно.

Пример (без фактического вызова ajax, но должен дать вам идею):

$(function() {
  $('form').on('submit', function (e) {
    e.preventDefault();
    
    var $options = $(this).find('select option');
    
    $options.val(function () {
      $(this).data('value', $(this).val());
      return $(this).text();
    });
    
    console.log($options.eq(0).val());
    console.log($options.eq(1).val());
    
    // ... Ajax stuff goes here ...
    
    // On ajax success:
    $options.val(function () {
      return $(this).data('value');
    });
    
    console.log($options.eq(0).val());
    console.log($options.eq(1).val());
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <select>
    <option value="1">one</option>
    <option value="2">two</option>
  </select>
  
  <button>submit</button>
</form>

Примечание, не связанное с этим: обычно рекомендуется использовать более конкретные селекторы, чем этот.Вы можете использовать классы, но я предлагаю использовать data- сами атрибуты в качестве селекторов (что оставляет классы для CSS).