Форма AJAX. Как убрать элемент у конкретной формы?

Question

[okovalev]

Проблема в том, что я цепляю обработчик по class myForm, а удаление события происходит по submit.attr("style", "display: none !important");
А формы, и получаеться, что в обоих формах исчезает кнопка. Так быть не должно.. (

<form class="booking-form myForm" id="" action="form.php">
	<div class="row">
		<div class="col-lg-12 d-flex flex-column">
		<input name="name" placeholder="Имя" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Ваше имя'" class="form-control mt-20" required="" type="text" required>
		</div>
		<div class="col-lg-12 d-flex flex-column">
		<input name="phone" placeholder="Телефон" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Телефон'" class="form-control mt-20" required="" type="text" required>
		</div>
		<div class="col-lg-12 flex-column">
		<textarea class="form-control mt-20" name="textclaim" placeholder="Сообщение" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Текст'" required=""></textarea>
		</div>
		<div class="col-lg-12 d-flex justify-content-end send-btn">
		<button class="submit-btn primary-btn mt-20 text-uppercase ">Подать в суд<span class="lnr lnr-arrow-right"></span></button>
		</div>
		<div class="alert-msg"></div>
</div>
</form>

$(document).ready(function() {
            var form = $('.myForm'); // contact form
            var submit = $('.submit-btn'); // submit button
            var alert = $('.alert-msg'); // alert div for show alert message

            // form submit event
            form.on('submit', function(e) {
                e.preventDefault(); // prevent default form submit

                $.ajax({
                    url: 'form.php', // form action url
                    type: 'POST', // form submit method get/post
                    dataType: 'html', // request type html/json/xml
                    data: form.serialize(), // serialize form data
                    beforeSend: function() {
                        alert.fadeOut();
                        submit.html('Отправка....'); // change submit button text
                    },
                    success: function(data) {
                        alert.html(data).fadeIn(); // fade in response data
                        form.trigger('reset'); // reset form
                        submit.attr("style", "display: none !important");; // reset submit button text
                    },
                    error: function(e) {
                        console.log(e)
                    }
                });
            });
        });

Answer 1

[tyzberd]

в submit напишите
var that = $(this);
Это будет ваша фома
а дальше
that.find('.submit-btn');

Comments

[okovalev]

Не понял (
У меня проблема в том, что у меня кнопка исчезает на всех формах :(

[tyzberd]

$(document).ready(function() {
            var form = $('.myForm'); // contact form
            var submit = $('.submit-btn'); // submit button
            var alert = $('.alert-msg'); // alert div for show alert message

            // form submit event
            form.on('submit', function(e) {
                e.preventDefault(); // prevent default form submit
                var that = $(this);
                $.ajax({
                    url: 'form.php', // form action url
                    type: 'POST', // form submit method get/post
                    dataType: 'html', // request type html/json/xml
                    data: form.serialize(), // serialize form data
                    beforeSend: function() {
                        alert.fadeOut();
                        submit.html('Отправка....'); // change submit button text
                    },
                    success: function(data) {
                        alert.html(data).fadeIn(); // fade in response data
                        form.trigger('reset'); // reset form
                        that.find('.submit-btn').attr("style", "display: none !important"); // reset submit button text
                    },
                    error: function(e) {
                        console.log(e)
                    }
                });
            });
        });

[okovalev]

tyzberd, не работает.
А ты можешь проконсультировать меня по верстке и JS с почасовой оплатой.
Сколько стоит с тобой поговорить?

[tyzberd]

Напиши свой скайп

[okovalev]

tyzberd, kovalev.o.c

Answer 2

[Lander]

$(document).ready(function() {
            var form = $('.myForm'); // contact form
            var submit = $('.submit-btn'); // submit button
            var alert = $('.alert-msg'); // alert div for show alert message
            var self = $( this );

            // form submit event
            form.on('submit', function(e) {
                e.preventDefault(); // prevent default form submit

                $.ajax({
                    url: 'form.php', // form action url
                    type: 'POST', // form submit method get/post
                    dataType: 'html', // request type html/json/xml
                    data: form.serialize(), // serialize form data
                    beforeSend: function() {
                        alert.fadeOut();
                        submit.html('Отправка....'); // change submit button text
                    },
                    success: function(data) {
                        alert.html(data).fadeIn(); // fade in response data
                        form.trigger('reset'); // reset form
                        self.find('.submit-btn').hide(); // reset submit button text
                    },
                    error: function(e) {
                        console.log(e)
                    }
                });
            });
        });