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

Новые блоги и статьи Все статьи Все блоги /
делаю науч статью по влиянию грибов на сукцессию anaschu 13.03.2026 прикрепляю статью	SDL3 для Desktop (MinGW): Создаём пустое окно с нуля для 2D-графики на SDL3, Си и C++ 8Observer8 10.03.2026 Содержание блога Финальные проекты на Си и на C++: hello-sdl3-c. zip hello-sdl3-cpp. zip Результат:	Установка CMake и MinGW 13.1 для сборки С и C++ приложений из консоли и из Qt Creator в EXE 8Observer8 10.03.2026 Содержание блога MinGW - это коллекция инструментов для сборки приложений в EXE. CMake - это система сборки приложений. Здесь описаны базовые шаги для старта программирования с помощью CMake и. . .	Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки Neotwalker 08.03.2026 Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .
Модульная разработка через nuget packages DevAlt 07.03.2026 Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .	Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .	Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование 8Observer8 05.03.2026 Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .	SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .

Есть модальная форма, если при 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