«AutoNumeric.js» не работает в динамически создаваемом элементе формы

Question

Я использую AutoNumeric.js (v4.6.0) в своем проекте, и у меня есть форма, которая динамически создает поле цены. Когда страница загружается, первый вход, который поступает по умолчанию, работает нормально, но те, которые создаются автоматически впоследствии, к сожалению, не работают. Как я могу решить эту проблему ? С этого момента спасибо.

      $(function () {
        new AutoNumeric(".autonumber", { currencySymbol : '$' });

        $(document).on('click', '#addSpending', function () {
            var newSpending =
                '<div class="row g-1">' +
                    '<div class="col-md-12">' +
                        '<input type="text" class="form-control autonumber" name="amount[]" required>' +
                    '</div>' +
                '</div>';

            $('#spendings').append(newSpending);
        });
    });

Answer 1

поместите внутрь своего циклического брата этот код $('.auto').autoNumeric('init');

Answer 2

Вам нужно использовать AutoNumeric экземпляр после того, как вы добавите поле в форму следующим образом:

      $(function () {
  $(document).on("click", "#addSpending", function () {
    var newSpending =
      '<div class="row g-1">' +
      '<div class="col-md-12">' +
      '<input type="text" class="form-control autonumber" name="amount" required>' +
      "</div>" +
      "</div>";

    $("#spendings").append(newSpending);
    new AutoNumeric("input[name=amount]", {
      currencySymbol: "$"
    })
  });
});

Вот еще и песочница