Есть модальная форма, если при Ajax отправке она не прошла валидацию, то ее (форму) не надо закрывать

@mrWan · Регистрация: 07.02.2017

Студворк — интернет-сервис помощи студентам

есть модальная форма, если при Ajax отправке она не прошла валидацию, то ее(форму) не надо закрывать а например вывезти в модальной форме ошибку какую нибудь. А если все валидация пройдена, то закрыть форму

JavaScript
1
2
3
4
5
6
7
8
9
10
success: function(data) {
            (тут  условие, если пустая глобальная переменная POST) {
             выводим в #блок формы сообщение об ошибке $('#блок в форме').html('все поля должны быть заполнены');
            } 
            иначе {
            $('.modal-backdrop').css('display','none');
            $(".modal").modal("hide");
            $('#results').html('сообщение отправленно');
           }
        },

Парни переведите кто пожалуйста! Всем спасибо!!

@msheal · 26.08.2017, 19:42

JavaScript
1
2
3
4
5
6
7
8
9
success: function(data) {
            if (data.error) {
             выводим в #блок формы сообщение об ошибке $('#блок в форме').html('все поля должны быть заполнены');
            } 
            else {
            $(".modal").modal("hide");
            $('#results').html('сообщение отправленно');
           }
        },

Я не понял сути вопроса, если честно, нужно больше информации. Я не знаю что сервер должен прислать в случае ошибки, ровно как и не известно куда надо выводить предупреждение о ошибке.

@mrWan · 26.08.2017, 21:02 **[ТС]**

сделал так:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 function call0() {
        var msg  = $('#send-mail0').serialize();
        $.ajax({
          type: 'POST',
          url: "/action.php",
          data: msg,
          success: function(data) {
            if (!data) {
                $('#formmsg0').html('телефон должен быть заполнен'); 
            }
            else {
                $('.modal-backdrop').css('display','none');
                $(".modal").modal("hide");
                $('#results0').html(data);
            }
        },
    });
    }

Добавлено через 12 минут
но появилась еще одна проблема. У меня выводится список товаров через foteach, у каждого товара есть кнопка обратного звонка.

PHP
1
2
3
4
$i=0
foreach 
 ...<form onsubmit="call<?=$i?>()">...
/foreach

мне приходится дублировать js код

JavaScript
1
2
3
4
5
6
<script>
function call0() { }
 function call1() { }
 function call2() { }
 function call3() { }
</script>

все бы хорошо, если бы у меня был бы вывод определенного количества товаров на странице, можно было продублировать код до определенного количества, но у меня в админке можно менять количество товаров на странице, копировать js код впрок не хочется, должен же быть более подходящий вариант. Кто знает как это сделать? только начинаю знакомство с JS

@msheal · 26.08.2017, 21:29

PHP
1
2
3
4
5
$i=0
foreach 
 ...<form onsubmit="call<?=$i?>()">...
...<script><?=function call$i() {}?></script>
/foreach

Подойдёт? Вариант на самом деле сомнительный в корне, ибо по-нормальному функция call должна не дублироваться по сто раз, а принимать айди товара и соответственно его обрабатывать.

@mrWan · 27.08.2017, 02:47 **[ТС]**

msheal, изначально так и делал, но по сео соображениям пожил в отдельный js файл! Мне нужно что то потипу как this в php

@msheal · 27.08.2017, 11:00

Я не имею ни малейшего понятия что происходит в вашей функции call и что общего у функций этого типа.

@mrWan · 27.08.2017, 13:16 **[ТС]**

msheal, функция call забирает значение у формы, которая была нажата и отправляет почту

@msheal · 27.08.2017, 16:15

Сам html (для примера сделал 2 независимые формы)

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<form>
  <input type="text" name="item">
  <input type="text" name="value">
  <button type="submit">Submit</button>
  <div class="result">First form result</div>
</form>
<br>
<form>
  <input type="text" name="item">
  <input type="text" name="value">
  <button type="submit">Submit</button>
  <div class="result">Second form result</div>
</form>

Сам скрипт

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$('form').on('submit', function(e){
    e.preventDefault();//блокируем дефолтную отправку формы
  
    var msg = $(this).serialize();
  var resultOutput = $(this).find('.result');
  
  $.ajax({
          type: 'POST',
          url: '/action.php',
          data: msg,
          success: function(data) {
            if (!data) {
                resultOutput.text('телефон должен быть заполнен'); 
            }
            else {
                $('.modal-backdrop').css('display','none');
                $(".modal").modal("hide");
                resultOutput.text(data);
            }
        }
  })
})

Такое нужно было?

П.С. оставлю наглядный фидл на всякий случай https://jsfiddle.net/v7j2pu88/8/

@mrWan · 27.08.2017, 17:05 **[ТС]**

msheal, я думаю да, что то на это похоже, но я уже решил вопрос другим способом, потом ваш код разберу по полочкам в целях обучения, сейчас много ещё что другого нужно делать.
сделал так :

JavaScript
1
2
3
4
5
6
7
8
9
10
11
  $(".send-mail-button").on('click', function() { 
    var q = jQuery(this);
    var phone = jQuery(this).parent().find('input[name="phone"]').val(); 
    var name = jQuery(this).parent().find('input[name="name"]').val(); 
    var marka = jQuery(this).parent().find('input[name="marka"]').val(); 
    var model = jQuery(this).parent().find('input[name="model"]').val(); 
    var type = jQuery(this).parent().find('input[name="type"]').val(); 
    var price = jQuery(this).parent().find('input[name="price"]').val(); 
    var discount = jQuery(this).parent().find('input[name="discount"]').val(); 
    var year = jQuery(this).parent().find('input[name="year"]').val(); 
    var photo = jQuery(this).parent().find('input[name="photo"]').val();

наверное сериализовать можно =) как время будет, займусь этим.
в нужный класс result(которых много) закидываю значения таким способом :

JavaScript
1
 jQuery(q).closest('.products-box').find('.results').html(data);   // var q = jQuery(this); приходится делать переменную q, потому что почему то в success не видит $(this);

говно код или сойдет ??????

@msheal · 27.08.2017, 17:10

Ваш вариант весьма избыточен и нестабилен, я бы не советовал оставлять текущую реализацию)

П.С. код говно, но работать будет при условии, что вы не будете менять html разметку

@mrWan · 27.08.2017, 17:19 **[ТС]**

msheal, то есть если я поменяю структуру страницы, то потом не достучишься до нужного класса result ?
Объясните пожалуйста новичку

@msheal · 27.08.2017, 17:28

Например, стоит вам обернуть инпут в другой блок, всё перестанет работать. В моём примере выше, всё по-прежнему будет работать корректно, не важно какая разметка внутри потому-что я не привязываюсь к dom узлам (типа (this).parent()).

JavaScript
1
var phone = jQuery(this).parent().find('input[name="phone"]').val();

//var q = jQuery(this); приходится делать переменную q, потому что почему то в success не видит $(this);
Вы не правы, в чём легко убедиться с помощью простого вывода в консоль. this - это текущий контекст функции, который изменился внутри success

@mrWan · 27.08.2017, 18:41 **[ТС]**

спасибо ! буду читать ману

Добавлено через 10 минут
msheal, что посоветуете почитать толкового ?

@msheal · 27.08.2017, 20:09

mrWan, честно говоря, я не читал вобще ничего серъёзного, кроме хабра и ко. Всё достигалось путём набития шишек на реальных задачах)
Лично у меня, тонна информации из литературы крайне слабо усваивается. Вроде как и понимаешь все эти умные словечки, но когда дело доходит до дела (ага, тавтология), то становится крайне сложно выудить хоть что-то из головы. Другое дело, когда на практике испробовал много вариантов решения задачи, нашел оптимальное решение, понял почему оно лучше остальных - такие ситуации запоминаются на вечно)

Новые блоги и статьи Все статьи Все блоги /
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Рецензия / Мнение Это мой обзор планшета X220 с точки зрения школьника. Недавно я решила попытаться уменьшить свой. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .

Есть модальная форма, если при Ajax отправке она не прошла валидацию, то ее (форму) не надо закрывать

Решение

Решение

@mrWan 16 / 14 / 16 Регистрация: 07.02.2017 Сообщений: 292
	27.08.2017, 02:47 [ТС]
	msheal, изначально так и делал, но по сео соображениям пожил в отдельный js файл! Мне нужно что то потипу как this в php 0

@msheal 707 / 309 / 191 Регистрация: 05.03.2015 Сообщений: 822
	27.08.2017, 11:00
	Я не имею ни малейшего понятия что происходит в вашей функции call и что общего у функций этого типа. 0

@mrWan 16 / 14 / 16 Регистрация: 07.02.2017 Сообщений: 292
	27.08.2017, 13:16 [ТС]
	msheal, функция call забирает значение у формы, которая была нажата и отправляет почту 0

@msheal 707 / 309 / 191 Регистрация: 05.03.2015 Сообщений: 822
	27.08.2017, 17:10
	Ваш вариант весьма избыточен и нестабилен, я бы не советовал оставлять текущую реализацию) П.С. код говно, но работать будет при условии, что вы не будете менять html разметку 0

@mrWan 16 / 14 / 16 Регистрация: 07.02.2017 Сообщений: 292
	27.08.2017, 17:19 [ТС]
	msheal, то есть если я поменяю структуру страницы, то потом не достучишься до нужного класса result ? Объясните пожалуйста новичку 0

@mrWan 16 / 14 / 16 Регистрация: 07.02.2017 Сообщений: 292
	27.08.2017, 18:41 [ТС]
	спасибо ! буду читать ману Добавлено через 10 минут msheal, что посоветуете почитать толкового ? 0

@msheal 707 / 309 / 191 Регистрация: 05.03.2015 Сообщений: 822
	27.08.2017, 20:09
	Сообщение было отмечено mrWan как решение Решение mrWan, честно говоря, я не читал вобще ничего серъёзного, кроме хабра и ко. Всё достигалось путём набития шишек на реальных задачах) Лично у меня, тонна информации из литературы крайне слабо усваивается. Вроде как и понимаешь все эти умные словечки, но когда дело доходит до дела (ага, тавтология), то становится крайне сложно выудить хоть что-то из головы. Другое дело, когда на практике испробовал много вариантов решения задачи, нашел оптимальное решение, понял почему оно лучше остальных - такие ситуации запоминаются на вечно) 0