https://hotelsvetlanasochi.ru/js/form_ajax.js?v=1782804710

1function viewLoadImg(_this){
2    let _max_size = 4194304, // 4mb
3        _max_img = 4, // сколько файлов можно загружать
4        _files = _this.files,
5        _lenght = _files.length;
6    let valid_ext = ["jpg", "jpeg", "webp", "png"]; //файлы которые можно загружать
7    let low_case;
8
9    $(_this).closest('.js_line_form_img').find('.info_inp').remove();
10    $(_this).closest('form').find('.view_load_img div').remove();
11
12    for (const file of _this.files) {
13        $(_this).closest('form').find('.view_load_img').append("<div>"+file.name+" размер файла "+file.size+" байт.</div>");
14    }
15
16    $(_this).closest('form').find('.view_load_img').append('<div>Выбранно '+_lenght+' файлов</div>');
17
18    // Проверяем на количество картинок
19    if(_lenght > _max_img){
20        $(_this).closest('.js_line_form_img').addClass('error').removeClass('correct').append('<div class="info_inp">Не больше '+_max_img+' картинок</div>');
21        return false;
22    } else {
23        $(_this).closest('.js_line_form_img').removeClass('error').addClass('correct');
24    }
25
26    // Проверяем размер каждого файла и его расширение
27    for (const _file_item of _this.files) {
28        low_case = ext(_file_item.name);
29        if(_file_item.size > _max_size){
30            $(_this).closest('.js_line_form_img').addClass('error').removeClass('correct').append('<div class="info_inp">Один из файлов превышает максимальный размер, '+_max_size+' байт</div>');
31            return false;
32        } else if(!valid_ext.includes(low_case.toLowerCase())){
33            $(_this).closest('.js_line_form_img').addClass('error').removeClass('correct').append('<div class="info_inp">Не верный тип файла: '+_file_item.name+'</div>');
34            return false;
35        } else {
36            $(_this).closest('.js_line_form_img').removeClass('error').addClass('correct');
37        }
38    }
39
40    function ext(name) {
41        let m = name.match(/\.([^.]+)$/)
42        return m && m[1]
43    }
44}
45
46//проверяем что бы обязательное поле не было пустым
47function checkLength(_this){
48    let _parent = _this.closest('.js_line_form');
49    if(_this.val().length === 0) {
50        _parent.find('.info_inp').remove();
51        _parent.addClass('error').removeClass('correct').append('<div class="info_inp">Поле обязательно для заполнения</div>');
52    } else {
53        _parent.removeClass('error').addClass('correct').find('.info_inp').remove();
54    }
55}
56
57// проверяем email
58function checkEmail(_this){
59    let reg = /^[a-zA-Z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-zA-Z0-9!#$%&'*+\/=?^_`{|}~-]+)*@(?:[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?\.)+[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?$/;
60    let address = _this.val();
61    if(reg.test(address) == false) {
62        _this.closest('.js_line_form').find('.info_inp').remove();
63        _this.closest('.js_line_form').addClass('error').removeClass('correct').append('<div class="info_inp">Email введен некорректно</div>');
64    } else {
65        _this.closest('.js_line_form').removeClass('error').addClass('correct').find('.info_inp').remove();
66    }
67}
68
69// проверяем телефон
70function checkTel(_this){
71    let reg = /^\+7\s\([0-9]{3}\)\s[0-9]{3}\-[0-9]{2}\-[0-9]{2}$/;
72    let address = _this.val();
73    if(reg.test(address) == false) {
74        _this.closest('.js_line_form').find('.info_inp').remove();
75        _this.closest('.js_line_form').addClass('error').removeClass('correct').append('<div class="info_inp">Номер телефона введен некорректно</div>');
76    } else {
77        _this.closest('.js_line_form').removeClass('error').addClass('correct').find('.info_inp').remove();
78    }
79}
80
81// проверяем radio
82function checkRadio(_this){
83    _this.each(function(i, e){
84        if(e.checked == true){
85            _this.closest('.js_line_form').removeClass('error').addClass('correct').find('.info_inp').remove();
86            return false;

87        } else {
88            _this.closest('.js_line_form').find('.info_inp').remove();
89            _this.closest('.js_line_form').addClass('error').removeClass('correct').append('<div class="info_inp">Нужно что-то выбрать</div>');
90        }
91    });
92}
93
94// проверяем select
95function checkSelect(_this){
96    _this.each(function(i, e){
97        if(e.selected == true){
98            if(e.disabled == true){
99                _this.closest('.js_line_form').find('.info_inp').remove();
100                _this.closest('.js_line_form').addClass('error').removeClass('correct').append('<div class="info_inp">Нужно что-то выбрать</div>');
101                return false;
102            }
103            _this.closest('.js_line_form').removeClass('error').addClass('correct').find('.info_inp').remove();
104            return false;
105        } else {
106            _this.closest('.js_line_form').find('.info_inp').remove();
107            _this.closest('.js_line_form').addClass('error').removeClass('correct').append('<div class="info_inp">Нужно что-то выбрать</div>');
108        }
109    });
110}
111
112// проверяем обязательные поля и ставим нужные классы
113// в div с классом js_line_form, если надо input сделать обязательным, добавьте класс required
114// добавить класс js_check_email для тега input, для проверки email
115// добавить класс js_check_tel для тега input, для проверки маски телефона
116// добавить класс js_check_textarea для тега textarea, для проверки на заполненность
117// добавить класс js_check_checked для тега input, для проверки check или radiobox
118// добавить класс js_check_select для тега select, для проверки выбора
119function checkRequired(_form){
120    $(_form).find('.js_line_form').each(function(i, e){
121        if(i !== 0){
122            if($(e).hasClass('required')){
123                if($(e).find('input').hasClass('js_check_email')){
124                    checkEmail($(e).find('input'));
125                } else if($(e).find('input').hasClass('js_check_tel')) {
126                    checkTel($(e).find('input'));
127                } else if($(e).find('textarea').hasClass('js_check_textarea')){
128                    checkLength($(e).find('textarea'));
129                } else if($(e).find('input').hasClass('js_check_checked')){
130                    checkRadio($(e).find('input'));
131                } else if($(e).find('select').hasClass('js_check_select')){
132                    checkSelect($(e).find('select option'));
133                } else {
134                    checkLength($(e).find('input'));
135                }
136            } else {
137                $(e).addClass('correct');
138            }
139        }
140    });
141    return checkFormReady($(_form).find('.js_line_form'));
142}
143
144// можно ли сделать AJAX запрос
145function checkFormReady(_form){
146    let _return = true;
147    if($('.js_line_form_img').hasClass('error')){
148        _return = false;
149    }
150    $(_form).each(function(i, e){
151        if(i !== 0){
152            if($(e).hasClass('error')){
153                _return = false;
154            }
155        }
156    });
157    return _return;
158}
159
160// маска телефона
161let masks = {
162    init: function () {
163        this.phoneMask()
164    },
165    phoneMask: function (t) {
166        let n = void 0 !== t ? t : $('input.maskphone'),
167            i = !1,
168            a = {};
169        n.each(function () {
170            let t = $(this);
171            t.mask && (t.on("paste drop", function () {
172                    let t = $(this),
173                        n = !t.val(),
174                        a = t.get(0),
175                        e = a.selectionEnd - a.selectionStart;
176                    (n || t.val().length === e) && (i = !0)
177                }),
178                    t.on("input", function (t) {
179                        let n = $(this),
180                            a = n.val();
181                        if (a.startsWith("8")) {
182                            if (i && 11 !== a.length)
183                                return void (i = !1);
184                            i = !1,
185                                t.stopPropagation(),
186                                a = a.replace("8", "+7"),
187                                n.val(a)
188                        }
189                    }),
190                    t.mask("+7 (000) 000-00-00", a)
191            )
192        })
193    }
194};
195
196$(document).ready(function(){
197    masks.init();
198
199    $('.js_ajax_form').on('click', function(e){
200        e.preventDefault();
201        if(checkRequired($(this).closest('form'))){
202            let _data_form = document.forms.form_full;
203            let file_data = $('.js_form_files')[0].files;
204            let formData = new FormData(_data_form);
205            $.each(file_data, function (key, value) {
206                formData.append('file-'+key, value);
207            });
208            formData.delete('files')
209            $.ajax({
210                type: 'post',
211                url: '/inc/send.php',
212                cache: false,
213                contentType: false,
214                processData: false,
215                data: formData,
216                dataType: 'json',
217                success: function (result) {
218                    if(result.result == 'success'){
219                        document.forms.form_full.reset();
220                        $('.view_load_img').find('div').remove();
221                        $('.js_line_form, .js_line_form_img').removeClass('correct error');
222                        alert('Письмо успешно отправлено');
223                    }
224                },
225                error: function (result) {
226                    alert('Ошибка загрузки');
227                }
228            });
229        }
230        return false;

231    });
232
233    $('.js_check_email').on('blur', function(){
234        let _this = $(this);
235        if(_this.closest('.js_line_form').hasClass('required') || _this.val().length){
236            checkEmail(_this);
237        }
238    });
239
240    $('.js_check_tel').on('blur', function(){
241        let _this = $(this);
242        if(_this.closest('.js_line_form').hasClass('required')) {
243            checkTel(_this);
244        }
245    });
246
247    $('.js_check_textarea').on('blur', function(){
248        let _this = $(this);
249        if(_this.closest('.js_line_form').hasClass('required')) {
250            checkLength(_this);
251        }
252    });
253});