Есть 2 формы как понять какая заполнена и отправить данные этой формы?

Question

[xonar]

Здравствуйте.

Есть 2 формы на сайте и 2 функции под них. Если отправляется одна форма, то срабатывает одна функция, если вторая форма, то срабатывает вторая функция.

Кнопки сабмита одинаковые по классу, но у них разные data-modal-id пробовал проверять по инпутам заполненым они разные у форм, но что не выходит. Ниже приложу 2 функции разные первая для 1 формы, вторая для второй. Нужно чтобы если нажата кнопка сабмита получить её значение и если она равна первой форме, то выполнять первую функцию, если нет то второй.

Первая функция для формы с кнопкой отправки у которого data-modal-id="done27309"

$('.form-element').submit(function() {
    var button = document.querySelector('input[name="form[771611]"]:checked').value;
    var color = null;
    if(button == 'Белый'){
        color = 'qFKoR7ETgK9EQiH99XsXJ0';
    } else {
        color = '6vPnHI0RjsnKO7iKGmEYu2';
    }

        _rc('send', 'order', {
            'name': $(this).find('input[name="form[273045]"]').val(),
            'phone': $(this).find('input[name="form[666702]"]').val(),
            'customlead_for_site': 'site.ru',
            'itemId': color,
        });
        return false;
    })

Вторая функция для формы с кнопкой отправки у которого data-modal-id="done48767"

$('.form-element').submit(function() {
		_rc('send', 'order', {
            'name': $(this).find('input[name="form[131660]"]').val(),
            'phone': $(this).find('input[name="form[674204]"]').val(),
            'customlead_for_site': 's.ru',
        });
        return false;
    })

Сами button кнопки имеют такую структуру

<a class="component-button form-field-submit effect--opacity weight--medium size--medium filled rounded wide" data-modal-id="done48767">

<div class="form-submit-text btn-text">Отправить</div></div>

</a>

Answer 1

[Diatomiccoder]

В jQuery есть возможность отфильтровать результат селектора следующим образом:

$('.form-element').has('a[data-modal-id="done27309"]').submit(function() {
    /*функция обработчик для первой формы*/
});

$('.form-element').has('a[data-modal-id="done48767"]').submit(function() {
    /*функция обработчик для второй формы*/
});

Comments

[xonar]

Спасибо. Работает!

Answer 2

[Надим]

Обработчики переделайте в функции. У вас должно быть 2 разных функции для отправки. Далее, внутри кнопок отправки просто впишите в атрибуте onclick вызов нужной функции.

Comments

[xonar]

Я бы так и сделал. Но, не могу. Нет доступа для переделывания кнопки от слова совсем. Никак не переделать.

[Надим]

xonar, тогда меняйте обработчики.

$('.form-element')[0] // Первая форма
$('.form-element')[1] // Вторая форма

[xonar]

Надим Закиров, Обработчик сменить тоже нельзя, по нему CRM система принимает значения.

нужно именно по кнопке отправки понимать какую функцию отправлять

<a class="component-button form-field-submit effect--opacity weight--medium size--medium filled rounded wide" data-modal-id="done48767">

[xonar]

<script type="text/javascript">
    (function(_,r,e,t,a,i,l){_['retailCRMObject']=a;_[a]=_[a]||function(){(_[a].q=_[a].q||[]).push(arguments)};_[a].l=1*new Date();l=r.getElementsByTagName(e)[0];i=r.createElement(e);i.async=!0;i.src=t;l.parentNode.insertBefore(i,l)})(window,document,'script','https://collector.retailcrm.pro/w.js','_rc');

    _rc('create', 'RC-58694042979-2'); // это ключ от CRM аккаунта
    _rc('send', 'pageView');
</script>


<script type="text/javascript">
    
$(document).ready(function() {
  $('a.component-button').on('click', function() {
    var progress = $(this).attr('data-modal-id');
    
      if(progress == 'done48767') {
          
          //////функция нижняя кнопка
          $(function() {
    $('.form-element').submit(function() {
		_rc('send', 'order', {
            'name': $(this).find('input[name="form[131660]"]').val(),
            'phone': $(this).find('input[name="form[674204]"]').val(),
            'customlead_for_site': 'site.ru',
        });
                return false;
            })
            })
          
          ////
          
      } else if (progress = 'done27309') {
          //////первая форма отправки
          $(function() {
              $('.form-element').submit(function() {
    var button = document.querySelector('input[name="form[771611]"]:checked').value;
    var color = null;
    if(button == 'Белый'){
        color = 'qFKoR7ETgK9EQiH99XsXJ0';
    } else {
        color = '6vPnHI0RjsnKO7iKGmEYu2';
    }

        _rc('send', 'order', {
            'name': $(this).find('input[name="form[273045]"]').val(),
            'phone': $(this).find('input[name="form[666702]"]').val(),
            'customlead_for_site': 'site.ru',
            'itemId': color,
        });
        return false;
    })
              
          })
          
          ////
      }
  });
});

</script>

[xonar]

Надим Закиров, В ответе выше скинул код. Тут он понимает, если форма 1 нажата и отправляет функцию формы один. Но, если во второй форме заполняю, то ничего не отправлят. А должен вторую функцию

[Надим]

xonar, не извини. Бесплатно я это разбирать не буду, это надо вникать.