Динамический ID

174
12 апреля 2022, 13:40

Есть форма, которая вызывается на странице несколько раз. Хочется чтобы у нее изменялся id по типу id="form+'i' ", где i увеличивается на один каждый раз, когда форма вызывается. Если, к примеру, на странице эта форма вызывается 3 раза, то у них будут айди "form1", "form2" и "form3" соответсвенно. Как такое реализовать?

Код формы. Она находится в отдельном php-файле и этот файл несколько раз вызывается через include в коде страницы. Форма отправляется через ajax

<form class="feedback-form" id="form" method="POST" action="/blocks/mail.php">
  <div class="result_form"></div>
  <input type="hidden" name="formData" value="Заголовок формы">
  <div class="form-group">
    <input required id="name" name="name" class="form-control frm-name" type="text" placeholder="Имя" />
    <script>
    $(function() {//<-- wrapped here
      $('.frm-name').on('input', function() {
      this.value = this.value.replace(/[^а-яА-Я]/g, ''); //<-- replace all other than given set of values
      });
    });
    </script>
</div>
<div class="form-group">
  <input required id="phone" name="phone" class="form-control frm-phone" type="text" placeholder="Телефон" />
  <script>
  $(function(){
    $(".frm-phone").mask("+7-(999)-999-99-99");
  });
  </script>
</div>
<button class="feedback-btn btn btn-primary" type="submit">Отправить</button>
</form>

И код отправки

 $(document).ready(function () {
    $('form').submit(function () {
      var formID = $(this).attr('id'); // Получение ID формы
      var formNm = $('#' + formID);
      $.ajax({
        type: 'POST',
        url: '/blocks/mail.php', // Обработчик формы отправки
        data: formNm.serialize(),
        success: function (data) {
          // Вывод текста результата отправки в текущей форме
          $(formNm).html(data);
        }
      });
      return false;
    });
  });
  

Я не придумал ничего лучшего, чем просто динамически подставлять в id формы номер в соответствии с вызовом. Может быть есть решение получше этого? ПС: форма отправляется, обработчик работает, но делает это с переходом на страницу обработчика. Т.е. ajax не работает или работает не так как нужно.

Answer 1

Конечно непонятно зачем это надо, но всё же. На backend считаете количество запросов и подставляете вместо id эту цифру

READ ALSO
Не подключаются кастомные шрифты на GitHub Pages

Не подключаются кастомные шрифты на GitHub Pages

Ссылка на репозиторий: https://githubcom/bergdev/bergdev

220
Какой пакет нужен в atom&#39;е, например чтобы после &lt;head&gt; он автоматически ставил &lt;/head&gt;?

Какой пакет нужен в atom'е, например чтобы после <head> он автоматически ставил </head>?

Очень не удобно без такого, поэтому временно на sublim'e

104
Не передаёт jquery post данные на php файл

Не передаёт jquery post данные на php файл

Здраствуйте, я столкнулся с такой проблемой, пишу данные в поле и текст кнопки обновляется при нажатии на саму кнопку но не отправляться данные...

108
Подскажите, пожалуйста, как по клику отображать/скрывать нужный слайдер?

Подскажите, пожалуйста, как по клику отображать/скрывать нужный слайдер?

У меня есть список, по клику на элемент списка у меня отображается нужный слайдер(использую slick-slider)Если повторно нажать на элемент списка,...

263