Как исправить: формы Django: {{form}} не показывает никакого результата на html-странице - PullRequest
0 голосов
/ 06 июня 2019

Я создал форму django:

#forms.py
from django import forms


class NameForm(forms.Form):
subject = forms.CharField(max_length=100)
message = forms.CharField(widget=forms.Textarea)
sender = forms.EmailField()
cc_myself = forms.BooleanField(required=False)

и в файле вида:

#views.py
def get_form(request):
print(request.POST)
form = NameForm(request.POST or None)
if form.is_valid():
    print(form.cleaned_data)
return render(request, "name.html", {"title": "Contact us"})

Я импортировал в html-файл внутри папки шаблонов:

#templates/name.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="/your-name/" method="post">
{% csrf_token %}
{{ form }}
<input type="submit" value="Submit">
</form>
</body>
</html>

Тем не менее, он не показывает ничего, кроме кнопки отправки.Я понятия не имею, в чем проблема.Я буду очень благодарен за решение этой проблемы.

Обновление: если я создаю новый HTML-файл, там отображается форма.Однако, если я использую его в своем основном html, включая boostarp, он не отображается.Вот полный код моего html:

{% extends 'base.html' %}

{% block content %}
    <!-- Team -->
    {% for card in cards %}
        <!-- Team member -->
        <div class="col-xs-12 col-sm-6 col-md-4">
            <div class="image-flip" ontouchstart="this.classList.toggle('hover');">
                <div class="mainflip">
                    <div class="frontside">
                        <div class="card">
                            <div class="card-body text-center">
                                <p><img class=" img-fluid"
                                        src="https://sunlimetech.com/portfolio/boot4menu/assets/imgs/team/img_01.png"
                                        alt="card image"></p>
                                <h4 class="card-title">{{ card.name }}</h4>
                                <p class="card-text">{{ card.description }}</p>
                                <a href="#" class="btn btn-primary btn-sm"><i class="fa fa-plus"></i></a>
                            </div>
                        </div>
                    </div>
                    <div class="backside">
                        <div class="card">
                            <div class="card-body text-center mt-4">
                                <h4 class="card-title">{{ card.name }}</h4>
                                <!--<p class="card-text"> {{ card.back_description }}-->
                                <form action="/your-name/" method="post">
                                    {% csrf_token %}
                                    {{ form }}
                                    <input type="submit" value="Submit">
                                </form>
                                <!--</p> -->
                                <ul class="list-inline">
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-facebook"></i>
                                        </a>
                                    </li>
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-twitter"></i>
                                        </a>
                                    </li>
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-skype"></i>
                                        </a>
                                    </li>
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-google"></i>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- ./Team member -->
    {% endfor %}

{% endblock %}

Это сводило меня с ума в течение трех дней.Я с нетерпением жду решения.Спасибо

Обновление2:

#base.html
{%  load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <link href="{% static 'css/stylesheet.css' %}" rel="stylesheet" type="text/css">
    <!------ Include the above in your HEAD tag ---------->
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<section id="team" class="pb-5">
    <div class="container">
        <h5 class="section-title h1">OUR TEAM</h5>
        <div class="row">
            {% block content %}
            {% endblock %}
        </div>
    </div>
</section>
</body>
</html>

#card.html
{% extends 'base.html' %}

{% block content %}
    <!-- Team -->
    {% for card in cards %}
        <!-- Team member -->
        <div class="col-xs-12 col-sm-6 col-md-4">
            <div class="image-flip" ontouchstart="this.classList.toggle('hover');">
                <div class="mainflip">
                    <div class="frontside">
                        <div class="card">
                            <div class="card-body text-center">
                                <p><img class=" img-fluid"
                                        src="https://sunlimetech.com/portfolio/boot4menu/assets/imgs/team/img_01.png"
                                        alt="card image"></p>
                                <h4 class="card-title">{{ card.name }}</h4>
                                <p class="card-text">{{ card.description }}</p>
                                <a href="#" class="btn btn-primary btn-sm"><i class="fa fa-plus"></i></a>
                            </div>
                        </div>
                    </div>
                    <div class="backside">
                        <div class="card">
                            <div class="card-body text-center mt-4">
                                <h4 class="card-title">{{ card.name }}</h4>
                                <!--<p class="card-text"> {{ card.back_description }}-->
                                <form action="/your-name/" method="post">
                                    {% csrf_token %}
                                    {{ form }}
                                    <input type="submit" value="Submit">
                                </form>
                                <!--</p> -->
                                <ul class="list-inline">
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-facebook"></i>
                                        </a>
                                    </li>
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-twitter"></i>
                                        </a>
                                    </li>
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-skype"></i>
                                        </a>
                                    </li>
                                    <li class="list-inline-item">
                                        <a class="social-icon text-xs-center" target="_blank" href="#">
                                            <i class="fa fa-google"></i>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- ./Team member -->
    {% endfor %}

{% endblock %}

1 Ответ

0 голосов
/ 06 июня 2019

измените эту строку в вашем views.py файле:

return render(request, "name.html", {"title": "Contact us"})

в этот:

return render(request, "name.html", {'form': form })
...