This commit is contained in:
SBD
2023-12-09 22:01:03 +03:00
parent 730853a3de
commit 4d6abd08ba
6 changed files with 92 additions and 28 deletions

View File

@@ -480,6 +480,14 @@ body.n_scroll{
flex-direction: row-reverse; flex-direction: row-reverse;
} }
.container_content_form_feedback.hide{
display: none;
}
.place_f_after_send.hide{
display: none;
}
.container_input{ .container_input{
margin-bottom: 25px; margin-bottom: 25px;
} }
@@ -495,10 +503,12 @@ body.n_scroll{
outline: none; outline: none;
padding-bottom: 5px; padding-bottom: 5px;
padding-left: 20px; padding-left: 20px;
transition: 500ms;
} }
.input_form_feedback.error{ .input_form_feedback.error{
border-bottom: 1px solid #FF3F20; border-bottom: 1px solid #FF3F20;
transition: 500ms;
} }
.input_form_feedback::placeholder{ .input_form_feedback::placeholder{
@@ -512,6 +522,7 @@ body.n_scroll{
display: block; display: block;
font-weight: 400; font-weight: 400;
font-size: 16px; font-size: 16px;
transition: 500ms;
} }
.textarea_form_feedback{ .textarea_form_feedback{
@@ -524,10 +535,12 @@ body.n_scroll{
padding: 20px 0 20px 20px; padding: 20px 0 20px 20px;
font-size: 16px; font-size: 16px;
font-family: -apple-system, 'Roboto', sans-serif; font-family: -apple-system, 'Roboto', sans-serif;
transition: 500ms;
} }
.textarea_form_feedback.error{ .textarea_form_feedback.error{
border: 1px solid #FF3F20; border: 1px solid #FF3F20;
transition: 500ms;
} }
.description_form_feedback_txt{ .description_form_feedback_txt{
@@ -559,6 +572,9 @@ body.n_scroll{
position: absolute; position: absolute;
bottom: 0; bottom: 0;
} }
.button_form_feedback.hide{
display: none;
}
.button_form_feedback:hover{ .button_form_feedback:hover{
color: #ffffff; color: #ffffff;
@@ -581,9 +597,11 @@ body.n_scroll{
height: 15px; height: 15px;
outline: none; outline: none;
margin: 6px 0; margin: 6px 0;
transition: 500ms;
} }
.check_box_form_feedback.error{ .check_box_form_feedback.error{
border: 1px solid #FF3F20; border: 1px solid #FF3F20;
transition: 500ms;
} }
.label_feedback_form_checkbox{ .label_feedback_form_checkbox{
@@ -592,9 +610,11 @@ body.n_scroll{
font-weight: 400; font-weight: 400;
width: 90%; width: 90%;
float: right; float: right;
transition: 500ms;
} }
.label_feedback_form_checkbox.error{ .label_feedback_form_checkbox.error{
color: #FF3F20; color: #FF3F20;
transition: 500ms;
} }
/* block plugin*/ /* block plugin*/
@@ -1243,3 +1263,13 @@ body.n_scroll{
margin: 0; margin: 0;
list-style: none; list-style: none;
} }
/* form feedback after send*/
.w_after_send{
width: 100%;
text-align: center;
height: 100%;
font-size: 36px;
margin: 26px 0;
}

View File

@@ -235,28 +235,37 @@ function autoPlaySlider () {
// form feedback // form feedback
function sendFormfeedback (el){ function sendFormfeedback (el){
event.preventDefault() if (!document.querySelector(".container_content_form_feedback").classList.contains('hide')){
let form = el.form event.preventDefault()
let formData = new FormData(form) let form = el.form
$.ajax({ let formData = new FormData(form)
headers: { "X-CSRFToken": $('input[name=csrfmiddlewaretoken]').val() }, let btn_form = document.querySelector(".button_form_feedback")
url: '/send_feedback_form/', if (!btn_form.classList.contains("hide")){
type: "POST", btn_form.classList.add('hide')
// async: true,
cache: false,
processData: false,
enctype: 'multipart/form-data',
contentType: false,
// contentType: "application/json; charset=utf-8",
data: formData,
success: function(data){
document.querySelector(".container_content_form_feedback").innerHTML = data.html
},
error: function (data){
document.querySelector(".form_feedback_content").innerHTML = data.responseJSON.left_form_html
document.querySelector(".checkbox_container").innerHTML = data.responseJSON.right_form_html
} }
}); $.ajax({
headers: { "X-CSRFToken": $('input[name=csrfmiddlewaretoken]').val() },
url: '/send_feedback_form/',
type: "POST",
// async: true,
cache: false,
processData: false,
enctype: 'multipart/form-data',
contentType: false,
// contentType: "application/json; charset=utf-8",
data: formData,
success: function(data){
document.querySelector(".place_f_after_send").innerHTML = data.html
document.querySelector(".place_f_after_send").classList.remove("hide")
document.querySelector(".container_content_form_feedback").classList.add('hide')
},
error: function (data){
document.querySelector(".form_feedback_content").innerHTML = data.responseJSON.left_form_html
document.querySelector(".checkbox_container").innerHTML = data.responseJSON.right_form_html
btn_form.classList.remove('hide')
}
});
}
} }
function deleteErrorsInput (el) { function deleteErrorsInput (el) {
@@ -279,3 +288,27 @@ function deleteErrorsInput (el) {
errors_container.outerHTML = str errors_container.outerHTML = str
} }
} }
function resetForm () {
let form = document.querySelector(".container_content_form_feedback")
form.classList.remove("hide")
let elements_form = document.querySelectorAll('.el_form_feedback')
for (let i = 0;i < elements_form.length;i++){
let cur_el = elements_form[i]
if (cur_el.value) {
cur_el.value = ''
}
if (cur_el.checked){
cur_el.checked = false
}
let label_w_error = cur_el.parentNode.querySelector(".label_feedback_form_checkbox.error")
if (label_w_error){
label_w_error.classList.remove("error")
}
}
document.querySelector(".place_f_after_send").classList.add('hide')
let btn_form = document.querySelector(".button_form_feedback")
if (btn_form.classList.contains("hide")){
btn_form.classList.remove('hide')
}
}

View File

@@ -8,6 +8,7 @@
<div class="container_content_form_feedback"> <div class="container_content_form_feedback">
{% include 'forms/f_feedback.html' %} {% include 'forms/f_feedback.html' %}
</div> </div>
<div class="place_f_after_send hide" onclick="resetForm()"></div>
</form> </form>
</div> </div>
</div> </div>

View File

@@ -1,19 +1,19 @@
{% load static %} {% load static %}
<input hidden="hidden" class="input_form_feedback" id="id_form_name" name="form_name" value="{{ feedback_form.initial.form_name }}"> <input hidden="hidden" class="input_form_feedback" id="id_form_name" name="form_name" value="{{ feedback_form.initial.form_name }}">
<div class="container_input"> <div class="container_input">
<input oninput="deleteErrorsInput(this)" class="input_form_feedback{% if feedback_form.errors.name %} error{% endif %}" id="id_name" name="name" placeholder="{{ feedback_form.name.label }}"{% if feedback_form.initial.name %} value="{{ feedback_form.initial.name }}"{% endif %}> <input oninput="deleteErrorsInput(this)" class="input_form_feedback{% if feedback_form.errors.name %} error{% endif %} el_form_feedback" id="id_name" name="name" placeholder="{{ feedback_form.name.label }}"{% if feedback_form.initial.name %} value="{{ feedback_form.initial.name }}"{% endif %}>
{% if feedback_form.errors.name %}<div class="error_input_html">{{ feedback_form.errors.name }}</div>{% endif %} {% if feedback_form.errors.name %}<div class="error_input_html">{{ feedback_form.errors.name }}</div>{% endif %}
</div> </div>
<div class="container_input"> <div class="container_input">
<input oninput="deleteErrorsInput(this)" class="input_form_feedback{% if feedback_form.errors.company %} error{% endif %}{% if feedback_form.errors.company %} error{% endif %}" id="id_company" name="company" placeholder="{{ feedback_form.company.label }}" {% if feedback_form.initial.company %} value="{{ feedback_form.initial.company }}"{% endif %}> <input oninput="deleteErrorsInput(this)" class="input_form_feedback{% if feedback_form.errors.company %} error{% endif %} el_form_feedback" id="id_company" name="company" placeholder="{{ feedback_form.company.label }}" {% if feedback_form.initial.company %} value="{{ feedback_form.initial.company }}"{% endif %}>
{% if feedback_form.errors.company %}<div class="error_input_html">{{ feedback_form.errors.company }}</div>{% endif %} {% if feedback_form.errors.company %}<div class="error_input_html">{{ feedback_form.errors.company }}</div>{% endif %}
</div> </div>
<div class="container_input"> <div class="container_input">
<input oninput="deleteErrorsInput(this)" class="input_form_feedback{% if feedback_form.errors.contacts %} error{% endif %}" id="id_contacts" name="contacts" placeholder="{{ feedback_form.contacts.label }}"{% if feedback_form.initial.contacts %} value="{{ feedback_form.initial.contacts }}"{% endif %}> <input oninput="deleteErrorsInput(this)" class="input_form_feedback{% if feedback_form.errors.contacts %} error{% endif %} el_form_feedback" id="id_contacts" name="contacts" placeholder="{{ feedback_form.contacts.label }}"{% if feedback_form.initial.contacts %} value="{{ feedback_form.initial.contacts }}"{% endif %}>
{% if feedback_form.errors.contacts %}<div class="error_input_html">{{ feedback_form.errors.contacts }}</div>{% endif %} {% if feedback_form.errors.contacts %}<div class="error_input_html">{{ feedback_form.errors.contacts }}</div>{% endif %}
</div> </div>
<div> <div>
<label class="label_feedback_form standart_txt" for="id_description">{{ feedback_form.description.label }}</label> <label class="label_feedback_form{% if feedback_form.errors.description %} error{% endif %} standart_txt" for="id_description">{{ feedback_form.description.label }}</label>
<textarea oninput="deleteErrorsInput(this)" class="textarea_form_feedback{% if feedback_form.errors.description %} error{% endif %}" id="id_description" name="description">{% if feedback_form.initial.description %}{{ feedback_form.initial.description }}{% endif %}</textarea> <textarea oninput="deleteErrorsInput(this)" class="textarea_form_feedback{% if feedback_form.errors.description %} error{% endif %} el_form_feedback" id="id_description" name="description">{% if feedback_form.initial.description %}{{ feedback_form.initial.description }}{% endif %}</textarea>
{% if feedback_form.errors.description %}<div class="error_input_html">{{ feedback_form.errors.description }}</div>{% endif %} {% if feedback_form.errors.description %}<div class="error_input_html">{{ feedback_form.errors.description }}</div>{% endif %}
</div> </div>

View File

@@ -1,5 +1,5 @@
{% load static %} {% load static %}
<input type="checkbox" onclick="deleteErrorsInput(this)" class="check_box_form_feedback{% if feedback_form.errors.agreement %} error{% endif %}" id="id_agreement" name="agreement" {% if feedback_form.initial.agreement %}checked{% endif %} /> <input type="checkbox" onclick="deleteErrorsInput(this)" class="check_box_form_feedback{% if feedback_form.errors.agreement %} error{% endif %} el_form_feedback" id="id_agreement" name="agreement" {% if feedback_form.initial.agreement %}checked{% endif %} />
<label class="label_feedback_form_checkbox{% if feedback_form.errors.agreement %} error{% endif %} standart_txt" for="id_agreement">{{ feedback_form.agreement.label }}</label> <label class="label_feedback_form_checkbox{% if feedback_form.errors.agreement %} error{% endif %} standart_txt" for="id_agreement">{{ feedback_form.agreement.label }}</label>
{% if feedback_form.errors.company %}<div class="error_input_html"></div>{% endif %} {% if feedback_form.errors.company %}<div class="error_input_html"></div>{% endif %}
<div class="clear_both"></div> <div class="clear_both"></div>

View File

@@ -1,3 +1,3 @@
<div> <div class="w_after_send">
Сообщение отправлено Сообщение отправлено
</div> </div>