Не удалось сбросить поле ввода в laravel

Question

Мне нужно сбросить поле ввода, когда пользователь нажимает кнопку отдыха, у меня есть другое содержимое на странице, которое очищается, кроме поля ввода, я не уверен, происходит ли это, потому что я использую старые значения послеотправить запрос.

 <input type="text" name="app_number" class="form-control" onreset="this.value=''" value="{!! Request::input('app_number') !!}" id="app_number" placeholder="Application Number" required>

JS для кнопки сброса:

document.getElementById("appForm").onreset = function() {
   document.getElementById("app_number").value = "";
  };

Кнопка сброса:

<button class="btn btn-primary" id="reset-button" type="reset">Reset</button>

Answer 1

Итак, отвечая на мой вопрос, мы будем благодарны за любые отзывы, но это работает.

Оказывается, что независимо от того, что value="{!! Request::input('app_number') !!}" всегда будет иметь значение, так как этот код выполняется на стороне сервера, и если вы не сделаете еще один запрос post, вы не сможете изменить значение, используя только ванильный JS и без post. запрос это не может быть сделано.

Таким образом, вместо получения значений из Request, почему бы просто не взять значения из пользовательского ввода и сохранить их в локальном хранилище, а затем просто взять их и вставить в поле ввода.

Я добавил onkeyup ион события в поле ввода

<input type="text" name="app_number" class="form-control" onkeyup='saveValue(this);' id="app_number" placeholder="Application Number" required>

и JS для хранения и извлечения ввода

document.getElementById("app_number").value = getSavedValue("app_number"); // set the value to this input

function saveValue(e) {
  var id = e.id; // get the sender's id to save it .
  var val = e.value; // get the value.
  localStorage.setItem(id, val); // Every time user writing something, the localStorage's value will override .
}

//get the saved value function - return the value of "v" from localStorage.
function getSavedValue(v) {
  if (!localStorage.getItem(v)) {
      return ""; // You can change this to your defualt value.
  }
  return localStorage.getItem(v);
}

и затем сбросьте форму как обычно

document.getElementById("appForm").onreset = function() {
document.getElementById("app_number").value = '';
};

Answer 2

Пожалуйста, попробуйте использовать в js как:

$(document).on('click', '#YourOnclickButtonID', function(){
    var $alertas = $('#YourFormID');
    $alertas.validate().resetForm();
});

Answer 3

Ваша кнопка сброса:

<button class="btn btn-primary" id="reset-button" onclick="myFunction()">Reset</button>

В js:

function myFunction(){
   document.getElementById("app_number").value = "";
}

Answer 4

В этом случае вы должны использовать JQuery Lib. Основной вам нужно установить идентификатор для этого элемента. И в jquery вы слушаете, нажмите на этот элемент.

$('#app_number').on('change', function () {
   // enter code here
});

Answer 5

Используйте type="reset" для вашей кнопки:

<button type="reset">Cancel</button>

Answer 6

попробуйте использовать reset (): . Document.getElementById ( "app_number") сброса ();