Merge pull request #206 from Modulos/feature/3040
Change border-color if contact field is empty
This commit is contained in:
commit
4a4ca3ff15
6 changed files with 104 additions and 72 deletions
12
alplora/static/alplora/js/form.js
Normal file
12
alplora/static/alplora/js/form.js
Normal file
File diff suppressed because one or more lines are too long
42
alplora/templates/alplora/contact.html
Normal file
42
alplora/templates/alplora/contact.html
Normal file
|
@ -0,0 +1,42 @@
|
|||
{% load i18n %}
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title" id="exampleModalLabel">{% trans 'New message'%}</h4>
|
||||
</div>
|
||||
<form novalidate method="post" action="{% url 'alplora:contact'%}" id="contact_form">
|
||||
<div class="modal-body">
|
||||
{% csrf_token %}
|
||||
{{ form.non_field_errors }}
|
||||
<div class="form-group text-left">
|
||||
<label for="recipient-name" class="control-label ">{% trans 'Name:'%}</label>
|
||||
<input type="text" class="form-control" {%if form.name.errors%}
|
||||
style="border-color: red" {%endif%} name="name" placeholder="{% trans 'What is your name ?'%}" id="recipient-name" required>
|
||||
{{ form.name.errors|striptags }}
|
||||
</div>
|
||||
<div class="form-group text-left">
|
||||
<label for="recipient-name" class="control-label ">{% trans 'From:'%}</label>
|
||||
<input type="text" class="form-control" {%if form.email.errors%}
|
||||
style="border-color: red" {%endif%}name="email" placeholder="{% trans 'You email'%}" id="recipient-name" required>
|
||||
{{ form.email.errors|striptags}}
|
||||
</div>
|
||||
<div class="form-group text-left">
|
||||
<label for="message-text" class="control-label ">{% trans 'Message:'%}</label>
|
||||
<textarea class="form-control" {%if form.message.errors %} style =
|
||||
"border-color: red" {%endif%} name="message" placeholder="{% trans 'Leave us your message'%}" id="message-text" required></textarea>
|
||||
{{ form.message.errors|striptags}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{% trans 'Close'%}</button>
|
||||
<button type="submit" class="btn btn-warning">{% trans 'Send message'%}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$('#contact_form').ajaxForm({
|
||||
target: '#modal', success: function(response) { }
|
||||
});
|
||||
</script>
|
21
alplora/templates/alplora/contact_success.html
Normal file
21
alplora/templates/alplora/contact_success.html
Normal file
|
@ -0,0 +1,21 @@
|
|||
{% load i18n %}
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">{% trans "Message Sent" %}</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{% trans "Thank you, we will contact you as soon as possible" %}</p>
|
||||
</div>
|
||||
<div class="modal-footer text-center">
|
||||
<button type="submit" class="btn btn-primary" data-dismiss="modal">Ok</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
<script>
|
||||
// close the modal after 3 seconds
|
||||
setTimeout(function() {
|
||||
$('#modal').modal('hide');
|
||||
}, 3000);
|
||||
</script>
|
|
@ -53,7 +53,6 @@
|
|||
|
||||
</script>
|
||||
|
||||
|
||||
<div class="page-loader">
|
||||
<div class="loader">
|
||||
<div class="circle circle-1"></div>
|
||||
|
@ -419,7 +418,9 @@
|
|||
<h1>{% trans 'How do I get Alplora?'%}</h1>
|
||||
<h3>{% trans 'Click the button below and leave us your contact.'%}<p></p>{% trans 'Team Alplora will contact you and visit you with a tracking device.'%}</h3>
|
||||
<hr class="intro-divider">
|
||||
<a href="#howitworks" class="btn btn-default btn-lg"><i class="#Services"></i> <span class="network-name" data-toggle="modal" data-target="#exampleModal" >{% trans 'Contact'%}</span></a>
|
||||
<a href="{% url 'alplora:contact' %}" data-toggle="modal" data-target="#modal" class="btn btn-default
|
||||
btn-lg"><i class="#Services"></i> <span
|
||||
class="network-name" >{% trans 'Contact'%}</span></a>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
@ -429,59 +430,8 @@
|
|||
</div>
|
||||
|
||||
<!-- CONTACT FORM MODAL -->
|
||||
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="color:black;">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title" id="exampleModalLabel">{% trans 'New message'%}</h4>
|
||||
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="color:black;">
|
||||
</div>
|
||||
<form method="POST" action="">
|
||||
<div class="modal-body">
|
||||
{% csrf_token %}
|
||||
{{ form.non_field_errors }}
|
||||
|
||||
<div class="form-group text-left">
|
||||
<label for="recipient-name" class="control-label ">{% trans 'Name:'%}</label>
|
||||
<input type="text" class="form-control" name="name" placeholder="{% trans 'What is your name ?'%}" id="recipient-name" required>
|
||||
</div>
|
||||
<div class="form-group text-left">
|
||||
<label for="recipient-name" class="control-label ">{% trans 'From:'%}</label>
|
||||
<input type="text" class="form-control" name="email" placeholder="{% trans 'You email'%}" id="recipient-name" required>
|
||||
{{ form.email.errors|striptags}}
|
||||
</div>
|
||||
<div class="form-group text-left">
|
||||
<label for="message-text" class="control-label ">{% trans 'Message:'%}</label>
|
||||
<textarea class="form-control" name="message" placeholder="{% trans 'Leave us your message'%}" id="message-text" required></textarea>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{% trans 'Close'%}</button>
|
||||
<button type="submit" class="btn btn-warning">{% trans 'Send message'%}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SUCCESS MODAL MESSAGE -->
|
||||
<div class="modal fade bs-example-modal-sm" style="color:black;" id="request-success-message" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title">{% trans "Message Sent" %}</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>{% trans "Thank you, we will contact you as soon as possible" %}</p>
|
||||
</div>
|
||||
<div class="modal-footer text-center">
|
||||
<button type="submit" class="btn btn-primary" data-dismiss="modal">Ok</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
||||
|
||||
<!-- /.container -->
|
||||
|
||||
|
@ -560,6 +510,7 @@
|
|||
|
||||
<script src="{% static 'alplora/js/main.js' %}"></script>
|
||||
|
||||
<script src="{% static 'alplora/js/form.js' %}"></script>
|
||||
|
||||
<link rel="stylesheet" href="/static/debug_toolbar/css/print.css" type="text/css" media="print">
|
||||
<link rel="stylesheet" href="/static/debug_toolbar/css/toolbar.css" type="text/css">
|
||||
|
@ -572,14 +523,15 @@
|
|||
<script src="/static/debug_toolbar/js/toolbar.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload=function(){
|
||||
var hash = window.location.hash.substr(1);
|
||||
if (hash == 'requestformsuccess'){
|
||||
$('#request-success-message').modal('show');
|
||||
}
|
||||
|
||||
};
|
||||
$('#modal').on('show.bs.modal', function (event) {
|
||||
var modal = $(this)
|
||||
$.ajax({
|
||||
url: "{% url 'alplora:contact' %}",
|
||||
context: document.body
|
||||
}).done(function(response) {
|
||||
modal.html(response);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,11 +1,12 @@
|
|||
from django.conf.urls import url
|
||||
|
||||
from .views import IndexView, LoginView
|
||||
from .views import IndexView, LoginView, ContactView
|
||||
|
||||
|
||||
urlpatterns = [
|
||||
url(r'^/?$', IndexView.as_view(), name='index'),
|
||||
url(r'/login/', LoginView.as_view(), name='login'),
|
||||
url(r'/contact', ContactView.as_view(), name='contact'),
|
||||
# url(r'^/beta-program/?$', BetaProgramView.as_view(), name='beta'),
|
||||
# url(r'^/landing/?$', LandingProgramView.as_view(), name='landing'),
|
||||
]
|
||||
|
|
|
@ -5,13 +5,12 @@ from django.utils.translation import ugettext_lazy as _
|
|||
from django.views.generic.edit import FormView
|
||||
from django.contrib import messages
|
||||
from django.core.urlresolvers import reverse_lazy, reverse
|
||||
from django.shortcuts import render
|
||||
|
||||
from utils.forms import ContactUsForm
|
||||
|
||||
class IndexView(FormView):
|
||||
class IndexView(TemplateView):
|
||||
template_name = "alplora/index.html"
|
||||
form_class = ContactUsForm
|
||||
success_message = _('Message Successfully Sent')
|
||||
|
||||
def get_context_data(self, *args, **kwargs):
|
||||
context = super(IndexView, self).get_context_data(**kwargs)
|
||||
|
@ -19,17 +18,22 @@ class IndexView(FormView):
|
|||
context.update(languages)
|
||||
return context
|
||||
|
||||
def get_success_url(self):
|
||||
success_url = reverse('alplora:index')
|
||||
success_url += "#requestformsuccess"
|
||||
return success_url
|
||||
class ContactView(FormView):
|
||||
template_name = 'alplora/contact.html'
|
||||
form_class = ContactUsForm
|
||||
success_message = _('Message Successfully Sent')
|
||||
|
||||
def get_context_data(self, *args, **kwargs):
|
||||
context = super(ContactView, self).get_context_data(**kwargs)
|
||||
languages = getlanguages()
|
||||
context.update(languages)
|
||||
return context
|
||||
|
||||
def form_valid(self, form):
|
||||
form.save()
|
||||
form.send_email(email_to='info@alplora.ch')
|
||||
messages.add_message(self.request, messages.SUCCESS, self.success_message)
|
||||
return super(IndexView, self).form_valid(form)
|
||||
|
||||
return render(self.request, 'alplora/contact_success.html', {})
|
||||
|
||||
class LoginView(TemplateView):
|
||||
template_name = "alplora/login.html"
|
||||
|
|
Loading…
Reference in a new issue