CODEWITHSUNDEEP
djangotemplatestextareaplaceholder
ClarkTheCoder
ClarkTheCoder

Reputation: 179

How to add placeholders to Textareas in Django

I have searched stack overflow, and I could not find an answer to this question. What I'm trying to do is add a placeholder to a textarea element but I don't know to accomplish this.

forms.py

from django import forms
from .models import Post
from django.contrib.auth.models import User

class PostForm(forms.ModelForm):
    class Meta:
        model = Post
        fields = (
            'price',
            'title',
            'body',
            'contact_email',
            'contact_number',
            'picture',
        )
        widgets = {
            'price': forms.TextInput(attrs={'placeholder': 'Price'}),
            'title': forms.TextInput(attrs={'placeholder': 'Item for sale'}),
            'body': forms.TextInput(attrs={'placeholder': 'Describe the item'}),
            'contact_email': forms.TextInput(attrs={'placeholder': 'Enter Price'}),
            'contact_number': forms.TextInput(attrs={'placeholder': 'Enter Price'}),
        }

So as you can see I've set placeholders that render correctly for all of the fields except the body field because unlike every other field, it's a <textarea></textarea> element, not an input element.

create-post.html

{% extends 'base.html' %}

{% block head %}
<!-- {% load static %}
<link rel="stylesheet" href="{% static 'accounts/login.css' %}" type="text/css"> -->
<title>Create Post</title>
{% endblock %}

{% block body %}

<div class="container"><br>
  <form method="POST" action='' enctype="multipart/form-data">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit" value="submit">Submit</button>
  </form>
</div>
{% endblock %}

This is how the form renders right now. As you can see the body is not large like it's supposed to be here.

How can I add a placeholder to a textarea element so it retains its size.

Upvotes: 1

Views: 1558

Answers (2)

Flames
Flames

Reputation: 1

forms.Textarea(attrs= {‘placeholder’: ‘what\’s on your mind ?’})

This will turn the box into a Textarea.

forms.TextInput(attrs= {‘placeholder’: ‘what\’s on your mind ?’})

This will make it a small box. It all depends on what you’re working on.

Upvotes: 0

ClarkTheCoder
ClarkTheCoder

Reputation: 179

Figured it out.

in widgets change TextInput to Textarea

'body': forms.Textarea(attrs={'placeholder': 'Describe the item'})

I did try that already, but I was capitalizing the A in Area.

Upvotes: 2

Related Questions