Как очистить поле ввода в jQuery?

Question

Как очистить поля ввода «add__description» и «add__value» после нажатия кнопки «Отправить» в моем приложении для бюджета.[В jQuery]

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="bottom">
  <div class="add">
    <div class="add__container">
      <select class="add__type">
        <option value="inc" selected>+</option>
        <option value="exp">-</option>
      </select>
      <input type="text" class="add__description" placeholder="Add description">
      <input type="number" class="add__value" placeholder="Value">
      <button class="add__btn"><i class="ion-ios-checkmark-outline"></i></button>
    </div>
  </div>

Я вызываю функцию очистки поля для очистки полей.Я пробовал что-то вроде этого ...

clearFields: function() {
        $(".add__description, .add__value").val("");
    },

Вот ссылка codePen - Ссылка CodePen

Answer 1

clearFields: function() {
  $element.click(function (e) {
    $('.add__description, .add__value').val('');
  }
},

$(function(){
  $('button.add__btn').click(function(){
     $('.add__description, .add__value').val('');
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="bottom">
  <div class="add">
    <div class="add__container">
      <select class="add__type">
        <option value="inc" selected>+</option>
        <option value="exp">-</option>
      </select>
      <input type="text" class="add__description" placeholder="Add description">
      <input type="number" class="add__value" placeholder="Value">
      <button class="add__btn"><i class="ion-ios-checkmark-outline"></i></button>
    </div>
  </div>

Answer 2

Синтаксис jQuery правильный из @ pid

Вам также необходимо включить вызов clearFields в свой метод addListItem

addListItem: function(obj, type) {
    ...
    this.clearFields();
},

https://codepen.io/pxfunc/pen/XoWrzo

Answer 3

В функции очистки просто сделайте это:

    $(".add__description,.add__value").val("");

Вы неправильно восприняли элементы.Достаточно имени класса.

---

РЕДАКТИРОВАТЬ: просмотр кода пера

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

Для этого вам нужно переместить строку

UICtrl.clearFields();

в метод eventBtn(), например:

function eventBtn() {
    var input = UICtrl.getInp();

    var newItem = budgetCtrl.addItem(input.type, input.des, input.val);

    UICtrl.addListItem(newItem, input.type);
    UICtrl.clearFields();
}