带有Bootstrap的Django联系表

时间:2018-11-16 06:37:10

标签: django forms email bootstrap-4

我有一个名为contact的应用程序,该应用程序以页脚/页眉呈现home.html的扩展。我用以下代码在其中放入了引导程序表单:

<div class="form-area">  
        <form role="form">

                    <div class="form-group">
                        <input type="text" class="form-control" id="name" name="name" placeholder="Name" maxlength="70" required>
                    </div>
                    <div class="form-group">
                        <input type="text" class="form-control" id="email" name="email" placeholder="Email" required>
                    </div>

                    <div class="form-group">
                        <input type="text" class="form-control" id="subject" name="subject" placeholder="Subject" maxlength="70" required>
                    </div>
                    <div class="form-group">
                    <textarea class="form-control" type="textarea" id="message" placeholder="Message" maxlength="300" rows="7"></textarea>                
                    </div>

        <button type="button" id="submit" name="submit" class="btn btn-m btn-secondary">Submit Form</button>
        </form>

我想使用该表格发送电子邮件,我已经知道我应该使用易碎的表格,但是我不知道从哪里开始。我不确定是否应该在Django中创建模型或表单。有一些教程显示了电子邮件逻辑和模板,但是它们使用的是内置表单。

非常感谢。

3 个答案:

答案 0 :(得分:1)

HTML文件baar.html

<div class="form-area">  
        <form role="form" method="post">

                    <div class="form-group">
                        <input type="text" class="form-control" id="name" name="name" placeholder="Name" maxlength="70" required>
                    </div>
                    <div class="form-group">
                        <input type="text" class="form-control" id="email" name="email" placeholder="Email" required>
                    </div>

                    <div class="form-group">
                        <input type="text" class="form-control" id="subject" name="subject" placeholder="Subject" maxlength="70" required>
                    </div>
                    <div class="form-group">
                    <textarea class="form-control" type="textarea" id="message" placeholder="Message" maxlength="300" rows="7"></textarea>                
                    </div>

        <button type="button" id="submit" name="submit" class="btn btn-m btn-secondary">Submit Form</button>
        </form>

View.py

from django.shortcuts import render, redirect
from django.core.mail import send_mail
from django.conf import settings
def fooview(request):
    if request.method=="POST":
        name=request.POST.get('name')
        email=request.POST.get('email')
        subject=request.POST.get('subject')
        message=request.POST.get('message')
        send_mail(subject= subject,message= message,from_email=settings.DEFAULT_FROM_EMAIL,recipient_list = [email],fail_silently  = True,)
        return redirect('fooview')
    return render(request,'baar.html',{})

settings.py

DEFAULT_FROM_EMAIL='someemail@gmail.com'
EMAIL_USE_TLS = True
EMAIL_HOST = 'smtp.gmail.com'
EMAIL_HOST_USER = 'username'
EMAIL_HOST_PASSWORD = 'password'
EMAIL_PORT = 587

答案 1 :(得分:1)

首先将电子邮件配置添加到settings.py:

EMAIL_USE_TLS = True
EMAIL_HOST = 'smtp.gmail.com'
EMAIL_PORT = 587
EMAIL_HOST_USER = 'email@gmail.com'
EMAIL_HOST_PASSWORD = 'EMAIL_PASSWORD'
DEFAULT_FROM_EMAIL = 'webmaster@localhost'

接下来,我们将设置一些可以定向到我们的视图的URL。更新urls.py(从任何位置导入视图):

from . import views
url(r'^contact/$', views.contact, name='contact'),
url(r'^thanks/$', views.thanks, name='thanks'),

#For development
#EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'

现在,我们需要设置form.py本身:

from django import forms
class ContactForm(forms.Form):
    contact_name = forms.CharField(required=True, label="Name")
    contact_email = forms.EmailField(required=True, label="Email")
    content = forms.CharField(
        required=True,
        widget=forms.Textarea,
        label="Message"
    )

这是完整的views.py文件,以下说明:

from django.core.mail import BadHeaderError, EmailMessage
from django.shortcuts import render, redirect
from django.http import HttpResponse
from .forms import ContactForm

def contact(request):
    if request.method == 'GET':
        form = ContactForm()
    else:
        form = ContactForm(request.POST)
        if form.is_valid():
            contact_name = form.cleaned_data['contact_name']
            contact_email = form.cleaned_data['contact_email']
            content = form.cleaned_data['content']
            try:
                email = EmailMessage(contact_name,
                                    content,
                                    contact_email,
                                    ['youremail@gmail.com'], #change to your email
                                     reply_to=[contact_email],
                                   )
                email.send()
            except BadHeaderError:
                return HttpResponse('Invalid header found.')
            return redirect('./thanks/')
    return render(request, 'home/contact.html', {'form': form})


def thanks(request):
    return render(request, 'home/thanks.html', {)

答案 2 :(得分:0)

好的,让它正常工作。事实证明,引导表单有问题。还可以通过以下方式整理出Django:

views.py:

def contact(request):
    #check for POST requests on load.
    request.method == 'POST'
    subject = request.POST.get('subject')
    message = request.POST.get('message')
    email = request.POST.get('email')

    if subject and message and email:
        try:
            send_mail(subject, message, email, ['adam1edinburgh@gmail.com'])
        except BadHeaderError:
            return HttpResponse('Invalid header found.') 
        return HttpResponse('Thanks for your email')

    else:
        #loading contacts.html if no requests
        return render(request, 'personal/contact.html')

这有点奇怪,但是我首先检查是否有任何POST请求,当然也没有,因为如果没有请求,则呈现HTML。

表单代码,按钮类型错误。所以我改变了。另外,csrf令牌也是必须的。

<div class="form-area">  
        <form role="form" method="POST">
                    {% csrf_token %}
                        <input type="text" class="form-control" id="subject" name="subject" placeholder="Subject" maxlength="70" required>
                    </div>
                    <br>
                    <div class="form-group">
                        <input type="email" class="form-control" id="email" name="email" placeholder="Email" required>
                    </div>

                    <div class="form-group">
                    <textarea class="form-control" type="textarea" id="message" name="message" placeholder="Message" maxlength="300" rows="7"></textarea>                
                    </div>

        <button type="submit"  name="submit" class="btn btn-m btn-secondary">Submit</button>
        </form>

谢谢大家的帮助!