Установить значение по умолчанию для радиовхода с помощью javascript?

Question

В моей форме на рельсах у меня есть тип радиовхода, и если пользователи выбирают «Да» или «Нет», соответствующий текст ввода меняет свои атрибуты. В основном, если пользователь выбирает «Да», у него будет Вход, где он должен будет ввести значение, но если он выберет «Нет», он не сможет изменить значение не по умолчанию. Пока все не работает, за исключением того, что если пользователи выбирают «Да» и вводят значение, но понимают, что они допустили ошибку и хотят выбрать «Нет», то значение не сбрасывается по умолчанию, и оно является тем, которое он ввел в «Да» это остается. Почему ??? Вот что я сделал:

    <%= f.label :post_author_yes, 'Yes' %>
    <%= f.radio_button :author, 'Yes', class: 'radio-inline', onclick:'javascript:yesnoCheck();' %>
    <%= f.label :post_author_no, 'No' %>
    <%= f.radio_button :author, 'No', class: 'radio-inline', onclick:'javascript:yesnoCheck();' %>
    <div id="input" style="display:none">
       <%= f.text_field :author, class: 'edit_input', placeholder: 'Real Author', :readonly => true %>
     </div>

  function yesnoCheck(){
      if(document.getElementById('post_author_yes').checked)
      {
        document.getElementById('input').style.display = 'block';
        document.getElementById('post_author').readOnly = false;
      }
      else {
        document.getElementById('input').style.display = 'block';
        document.getElementById('post_author').readOnly = true;
        document.getElementById("post_author").setAttribute('value', 'No');
      }
  }

Answer 1

Чтобы восстановить исходное состояние поля, необходимо установить для свойства value элемента input пустую строку ('').

Посмотрите на пример ниже, где строка postAuthor.value = ''; сбрасывает post_author, изменяя свойство value.

const author = document.getElementById('author');
const postAuthor = document.getElementById('post_author');
const radios = document.querySelectorAll('input[name="post-author"]');

radios.forEach(radio => {
  radio.addEventListener('change', function(event) {
    if (event.target.value === 'Yes') {
      author.classList.remove('hidden');
    } else {
      author.classList.add('hidden');
      postAuthor.value = '';
    }
  });
});

.hidden {
  display: none;
}

<label>Post Author Yes
  <input type="radio" class="radio-inline" name="post-author" value="Yes">
</label>

<label>Post Author No
  <input type="radio" class="radio-inline" name="post-author" value="No">
</label>

<div id="author" class="hidden">
  <label for="post_author">Real Author</label>
  <input id="post_author" class="edit_input" type="text" placeholder="Real Author">
</div>