首页 > 解决方案 > 如何将 django 模型表单放入现成的模板中

问题描述

我有一个模型表单,允许用户发布和上传图片。它在空白模板上正常工作。所以现在我想把表格放在一个现成的模板中,该模板有用于创建帖子和上传图片的字段。页面如下所示: 页面如下所示:

我的模型.py:

class Post(models.Model):
    post = models.CharField(max_length=3000)
    pic = models.ImageField(blank=True)
    user = models.ForeignKey(User, on_delete=models.DO_NOTHING)
    created = models.DateTimeField(auto_now_add=True)
    updated = models.DateTimeField(auto_now=True)

表格.py

class PostForm(forms.ModelForm):
    post = forms.CharField(widget=forms.TextInput())

视图.py

class BaseView(TemplateView):
    template_name = 'base.html'

    def get(self, request):
        form = PostForm()
        posts = Post.objects.all().order_by('-created')
        users = User.objects.exclude(id=request.user.id)

        args = {'form': form,'users': users, 'posts': posts}
        return render(request, self.template_name, args)
    
    def post(self, request):
        form = PostForm(request.POST, request.FILES)
        if form.is_valid():
            post = form.save(commit=False)
            post.user = request.user
            post.save()
            
            pics = form.cleaned_data['pic']
            text = form.cleaned_data['post']
            form = PostForm()
            return redirect('base')

        args = {'form': form, 'text': text, 'pics':pics}
        return render(request, self.template_name, args)

在模板中我想使用的字段是这样的:

<div class="create-post">
                <div class="row">
                    <div class="col-md-7 col-sm-7">
                  <div class="form-group">
                    <img src="images/users/user-1.jpg" alt="" class="profile-photo-md" />
                    <textarea name="texts" id="exampleTextarea" cols="30" rows="1" class="form-control" placeholder="Write what you wish"></textarea>
                  </div>
                </div>
                    <div class="col-md-5 col-sm-5">
                  <div class="tools">
                    <ul class="publishing-tools list-inline">
                      <li><a href="#"><i class="ion-images"></i></a></li>
                    </ul>
                    <button class="btn btn-primary pull-right">Publish</button>
                  </div>
                </div>
                </div>
            </div>

如果你知道我怎么能解决这个问题,请帮忙。谢谢你。

标签: pythonhtmlcssdjangodjango-forms

解决方案


您需要根据此处的文档手动呈现表单字段:https ://docs.djangoproject.com/en/3.0/topics/forms/#rendering-fields-manually

因此,对于您的模板,这看起来像这样(草图):

<div class="create-post">
    <div class="row">
        <form action="{ url .... }" method="post">
            <div class="col-md-7 col-sm-7">
                <div class="form-group">
                    {{ form.pic }}
                    {{ form.post }}
                </div>
            </div>
            <div class="col-md-5 col-sm-5">
                <div class="tools">
                    <ul class="publishing-tools list-inline">
                        <li><a href="#"><i class="ion-images"></i></a></li>
                    </ul>
                    <button class="btn btn-primary pull-right">Publish</button>
                </div>
            </div>
        </form>
    </div>
</div>

您可以在 ModelForm 中指定小部件(例如 post 字段的 textarea)。您可以在此处查看示例:https ://docs.djangoproject.com/en/3.0/ref/forms/widgets/#specifying-widgets


推荐阅读