無法重置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

嘗試使用reset（）：document.getElementById（“app_number”）。reset（）;

Answer 2

使用type="reset"為您的按鈕：

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

Answer 3

在這種情況下，您必須使用JQuery Lib。 基本需要為此元素設置ID。 在jquery中你會聽到點擊這個元素。

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

Answer 4

你的重置按鈕：

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

在js中：

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

Answer 5

請嘗試在js中使用：

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

Answer 6

所以回答我自己的問題，任何反饋都會受到贊賞，但這是有效的。

事實證明，無論什么value="{!! Request::input('app_number') !!}"將始終具有值，因為此代碼在服務器端執行，除非您發出另一個post請求，否則您無法更改價值，並且只使用vanilla 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 = '';
};