Django M2M Form - django

i try to do checkboxes in form for M2M field, but have this error, have no idea how to fix it. Google didn't help me, i tried.
When i render objects as list, i can select few objects and save it, so problem is not in views.py ,but it doesn't work with checkboxes.
My code:
forms.py
class CheckoutForm(forms.ModelForm):
class Meta:
model = Checkout
fields = ('dishes', 'user')
def __init__(self, *args, **kwargs):
super(CheckoutForm, self).__init__(*args, **kwargs)
self.fields["dishes"].widget = CheckboxSelectMultiple()
self.fields["dishes"].queryset = Dish.objects.all()
so only way that i can see an form error:
render form fields - send a empty form - put back {{ form.as_p }} - i can see an error "field is required"
page.html
<form class="p-2" action="{% url 'make_order' %}" method="POST" enctype="multipart/form-data">
{% csrf_token %}
<select name="user">
<option value="{{ user.id }}">{{ user }}</option>
</select>
<div
class="row row-cols-1 row-cols-md-5 g-2"
style="margin-left: -40px"
>
{% for dish in dishes %}
<div class="col">
<div class="card" style="width: 14rem">
<img
class="card-img-top"
style="width: 220px; height: 240px"
src="{{ dish.image.url }}"
alt="Card image cap"
/>
<div class="card-body">
<h5 class="card-title">{{ dish.name }}</h5>
<p class="card-text">Description: {{ dish.description }}</p>
<p class="card-text">Ingredients: {{ dish.ingredients }} g</p>
<p class="card-text">Serving size: {{ dish.serving_size }} g</p>
<p class="card-text">Price: {{ dish.price }} UAH</p>
<input
type="checkbox"
class="btn btn-primary"
name="dishes"
id="{{ dish.id }}"
value="{{ dish.id }}"
/>Add to cart
</div>
</div>
</div>
{% endfor %}
<input type="submit" value="ADD" class="btn btn-primary" />
</form>
views.py
class OrderView(LoginRequiredMixin, CreateView):
model = Checkout
template_name = "food_order/make_order.html"
form_class = CheckoutForm
success_url = "/order/"
login_url = "/login/"
raise_exception = True
def form_valid(self, form):
print('i am here')
instance = form.save(commit=False)
instance.user = self.request.user
instance.save()
dishes = form.cleaned_data["dishes"]
for dish in dishes:
dish, created = Dish.objects.get_or_create(name = dish)
dish.save()
instance.dishes.add(dish)
instance.save()
print(instance.dishes)
print(instance)
form.save_m2m()
return super(OrderView, self).form_valid(form)
def get_context_data(self, **kwargs):
context = super(OrderView, self).get_context_data(**kwargs)
context["dishes"] = Dish.objects.all()
context["orders"] = Checkout.objects.all()
return context

I don't think you need to be tinkering with __init__ here when setting the widget. It may be overwriting your values for a modelform.
Try:
class CheckoutForm(forms.ModelForm):
class Meta:
model = Checkout
fields = ('dishes', 'user',)
widgets = {'dishes': forms.CheckboxSelectMultiple() }
This should work as m2m fields have the ModelMultipleChoiceField by default. If you want to make it all explicit, you can go with:
class CheckoutForm(forms.ModelForm):
dishes = forms.ModelMultipleChoiceField(
queryset=Dish.objects.all(),
widget=forms.CheckboxSelectMultiple,
)
class Meta:
model = Checkout
fields = ('dishes', 'user',)
If you are formatting the checkboxes by hand
make sure they have name="dishes" (assuming dishes is the name of the field in your Checkout model) and value="<the dish id>"
You may also need to grab the values submitted with request.POST.getList('dishes'), otherwise you will ony get one value submitted

Related

Django UpdateView not loading forms with styles

I created a form using Django's UpdateView class, however, when the form loads it seems like the text boxes and text areas are not styled (looks like form.as_p style). Here is an example of exactly what I did.
Views.py
class UpdatePostView(UpdateView):
template_name = 'Post/UpdatePost.html'
model = Post
fields = ['Title', 'Body']
success_url = reverse_lazy('BlogApp:main')
def form_valid(self, form):
form.instance.Title = form.cleaned_data['Title']
form.instance.Body = form.cleaned_data['Body']
form.instance.save()
return super().form_valid(form)
Here is how I loaded the form in UpdatePost.html:
<form id="UpdatePostForm" method="POST">
{% csrf_token %}
<div class="form-group">
<label for="PostTitle">{{form.Title.label}}</label>
{{form.Title}}
</div>
<div class="form-group">
<label for="PostBody">{{form.Body.label}}</label>
{{form.Body}}
</div>
<input class="btn btn-primary" type="submit" for="UpdatePostForm" value="Update">
</div>
</form>
If you use Bootstrap, you also can use django-crispy-forms (version for Bootstrap 4 https://github.com/django-crispy-forms/django-crispy-forms ,version for Bootstrap 5 - https://github.com/django-crispy-forms/crispy-bootstrap5). It is helpful to live DRY (Don't repeat yourself).
And then it will be something like(I use crispy-forms for Bootstrap 5):
pip install crispy-bootstrap5
INSTALLED_APPS = (
...
"crispy_forms",
"crispy_bootstrap5",
...
)
CRISPY_ALLOWED_TEMPLATE_PACKS = "bootstrap5"
CRISPY_TEMPLATE_PACK = "bootstrap5"
class UpdatePostView(UpdateView):
template_name = 'Post/UpdatePost.html'
model = Post
fields = ['Title', 'Body']
success_url = reverse_lazy('BlogApp:main')
def form_valid(self, form):
form.instance.Title = form.cleaned_data['Title']
form.instance.Body = form.cleaned_data['Body']
form.instance.save()
return super().form_valid(form)
template
{% extends 'base.html' %}
{% load crispy_forms_tags %}
{% block content %}
<h1 class="text-center">Update Post</h1>
<br />
<form method="POST" enctype="multipart/form-data">
{% csrf_token %}
{{form|crispy }}
<button class="btn btn-outline-primary">
Update
</button>
</form>
{% endblock content %}
Because by default the form.body and form.title render a html input, you can override the class attribut from your UpdateView like that :
def get_form(self, *args, **kwargs):
form = super(UpdatePostView, self).get_form(*args, **kwargs)
form.fields["Title"].widget.attrs["class"] = "form-group"
form.fields["Body"].widget.attrs["class"] = "form-group"
return form

Customizing (style) ModelMultipleChoiceField in a on ManyToManyFields in Django

Am trying to customize my checkbox inputs to look like this [what i want to archive]
so i tried this...
profile.html
<ul class="wt-accountinfo">
{% for key, value in form.interests.field.choices %}
<li>
<div class="wt-on-off pull-right">
<input type="checkbox" id="{{ value }}" value="{{ key }}" name="interests">
<label for="{{ value }}"><i></i></label>
</div>
<span>{{ value | title }}</span>
</li>
{% endfor %}
</ul>
which renders the html fine but highlight the select fields from the database
but using {{ form.interest }} highlights the selected checked boxes from the database
here is the forms.py
class ProfileForm(forms.ModelForm):
interests = forms.ModelMultipleChoiceField(
queryset=JobsCategories.objects.all(), widget=forms.CheckboxSelectMultiple(),
required=False
)
class Meta:
model = Profile
fields = ['interests']
and here is the models.py
class Profile(models.Model):
user = models.OneToOneField(User, on_delete=models.CASCADE,
interests = models.ManyToManyField(Categories, related_name='interests', null=True, blank=True)
def __str__(self):
return f'{self.user.first_name} {self.user.last_name}'
in the views.py
def dashboard_profile(request):
if request.method == 'POST':
form = ProfileForm(request.POST, request.FILES, instance=request.user.profile)
account_form = AccountForm(request.POST, instance=request.user)
if form.is_valid() and account_form.is_valid():
f_interests = form.save(commit=False)
for i in request.POST.getlist('interest'):
f_interests.interest.update(i)
f_interests.save()
form.save_m2m()
account_form.save()
return redirect('index')
else:
form = ProfileForm(instance=request.user.profile)
account_form = AccountForm(instance=request.user)
context = {
'form': form,
'account_form': account_form,
}
return render(request, 'dashboard_profile.html', context)
NOTE!!! if i select the options i want and click save, it saves the options i checked to the database
this is it
this is it in the admins section
admin section
admin section 2
and also when i use {{ form.interests }} in the the template it renders fine and highlights the checked option from the database but its not styled
[how it looks like when i use {{ form.interests }}]
i know am missing somtehing in the profile.html so please help me out Thanks.
You're missing logic within your input tag to apply the existing value of the field choice.
<ul class="wt-accountinfo">
{% for key, value in form.interests.field.choices %}
<li>
<div class="wt-on-off pull-right">
<input type="checkbox"
id="{{ value }}"
value="{{ key }}"
name="interests"
{% if value %}checked{% endif %}>
<label for="{{ value }}"><i></i></label>
</div>
<span>{{ value | title }}</span>
</li>
{% endfor %}
</ul>

django images cannot be updated from defaults

I have an image upload function in django. However, images cannot be uploaded. The page is redirected to successURL. I don't understand the cause.
The view is current because it uses multiple forms.
#view
def UserEdit(request):
if request.method == 'POST':
form = forms.UserUpdateForm(request.POST, instance=request.user)
subform = forms.ProfileUpdateForm(request.POST, instance=request.user.profile)
if all([form.is_valid(), subform.is_valid()]):
user = form.save()
profile = subform.save()
return redirect('person:myaccount', username=request.user)
else:
form = forms.UserUpdateForm(instance=request.user)
subform = forms.ProfileUpdateForm(instance=request.user.profile)
return render(request, 'accounts/accounts_edit.html', {
'form': form,
'subform': subform,
})
#form
class UserUpdateForm(forms.ModelForm):
#...
class ProfileUpdateForm(forms.ModelForm):
class Meta:
model = profile
fields = ('first_name','last_name','birthday','image',)
#model
class profile(models.Model):
image = models.ImageField(upload_to='profile/',default='profile/default.jpg')
#html
<form method="POST" enctype="multipart/form-data">
{% csrf_token %}
<div class="text-center col-lg-6 col-md-6 col-sm-10 mx-auto">
<div class="form-group">
{{ form }}
</div>
<div class="form-group">
{{ subform }}
</div>
<button type="submit" class="fadeIn fourth btn btn-light">Submit</button>
</div>
</form>

Edit Model data using ModelForm: ModelForm validation error

I am working on my first django app. I am building an app that allows the user to rate beer. I want my user to be able to edit an entry they've already created. I take them to a ModelForm, and ask for their entry. When the POST method is called, my data is invalid. Here is my model.py:
from django.db import models
class Rating(models.Model):
beer_name = models.TextField()
score = models.DecimalField(max_digits=2, decimal_places=1)
notes = models.TextField(blank=True)
brewer = models.TextField(blank=True)
and forms.py:
from django import forms
from ratings.models import Rating
class RatingForm(forms.ModelForm):
class Meta:
model = Rating
fields = ['beer_name', 'score', 'notes', 'brewer']
Here is the views.py of my edit function:
def edit(request, row_id):
rating = get_object_or_404(Rating, pk=row_id)
if request.method == "POST":
form = RatingForm(request.POST, instance=rating)
if form.is_valid():
form.save()
return redirect(home)
else:
return HttpResponse("Invalid entry.")
else:
context = {'form': rating}
form = RatingForm(instance=rating)
return render(
request,
'ratings/entry_def.html',
context
)
However, every time the POST is called I get an "Invalid entry." HttpResponse, meaning my form.is_valid() is being returned False. Here is my template:
{% extends "base.html" %}
{% block content %}
<div class="container-fluid">
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<h2>Edit Rating</h2>
<form role="form" method="post">
{% csrf_token %}
<p>Beer Name: <textarea>{{ form.beer_name }}</textarea></p>
<p>Score: <input type="text" name="BeerScore" value="{{ form.score }}"></p>
<p>Notes: <textarea>{{ form.notes }}</textarea></p>
<p>Brewer: <textarea>{{ form.brewer }}</textarea></p>
<p><button type="submit" class="save btn btn-primary">Save</button></p>
<p><button type="reset" class="btn btn-primary">Cancel</button></p>
</form>
</div>
</div>
</div>
{% endblock %}
So when I press my Save button, I am getting the response. Here is my edit url in urls.py:
urlpatterns = [
...
url(r'rating/edit/(?P<row_id>[0-9]+)/$', edit , name='rating-edit'),
]
You're wrapping fields in other fields which don't have name attributes. This is most likely causing the values to be excluded from the request.POST data.
Additionally, Django form fields all have a corresponding HTML widget. So there's really no need to render the HTML by hand, unless you need to.
Change your template code to:
<p>
{{ form.beer_name.label }}: {{ form.beer_name }}
{% if form.beer_name.errors %}
<br />{{ form.beer_name.errors }}
{% endif %}{# repeat for other fields as needed #}
</p>
<p>{{ form.score.label }}: {{ form.score }}</p>
<p>{{ form.notes.label }}: {{ form.notes }}</p>
<p>{{ form.brewer.label }}: {{ form.brewer }}</p>
<p><button type="submit" class="save btn btn-primary">Save</button></p>
<p><button type="reset" class="btn btn-primary">Cancel</button></p>
If you need to change the widget, do so at the form class level:
class RatingForm(forms.ModelForm):
class Meta:
model = Rating
def __init__(self, *args, **kwargs):
super(RatingForm, self).__init__(*args, **kwargs)
self.fields['notes'].widget = forms.Textarea()
This way, Django manages the attributes and binding for you.
Your view can also use some cleanup:
def edit(request, row_id):
rating = get_object_or_404(Rating, pk=row_id)
form = RatingForm(request.POST or None, instance=rating)
if request.method == "POST" and form.is_valid():
form.save()
return redirect(home)
context = {'form': rating}
return render(request, 'ratings/entry_def.html', context)

Why is Django widgets for TimeInput not showing

I'm trying to create a TimeInput field in a form and noticed that the widget isn't showing correctly. But when I check the localhost:8000/admin, I see the widget showing up correctly.
My code is as follows. For models.py,
class TimeLimit(models.Model):
before = models.TimeField(blank=True, default=time(7, 0)) # 7AM
after = models.TimeField(blank=True, default=time(23, 0)) # 11PM
For views.py,
class UpdateTimeLimitView(LoginRequiredMixin, FormView):
model = TimeLimit
template_name = 'accounts/update_time_limit.html'
form_class = UpdateTimeLimitForm
def get_success_url(self):
return reverse_lazy('accounts:user_profile') + '?username=' + self.request.GET['username']
def get_context_data(self, **kwargs):
data = super(UpdateTimeLimitView, self).get_context_data(**kwargs)
data['username'] = self.request.GET['username']
return data
For forms.py,
class UpdateTimeLimitForm(forms.Form):
time_error = {'required': 'This field is required.',
'invalid': 'Please enter valid Hour:Minute values.'}
before = forms.TimeField(widget=forms.TimeInput(format='%H:%M'))
after = forms.TimeField(widget=TimeInput(format='%H:%M'))
class Meta:
model = TimeLimit
Finally, the relevant part for fields in update_time_limit.html,
<div class="container">
<form method="post">
{% csrf_token %}
<p>
{% for field in form %}
{{ field.errors }}
<label for="{{ field.id_for_label }}">{{ field.label }}({{ field.help_text }}):</label>
<br />
{{ field }}<br /><br /> and
{% endfor %}
</p>
<input class="btn btn-primary done-btn" type="submit" value="Update Time Limit">
</form>
</div>
Is there anything that I'm missing or doing wrong? Thank you.
The Django admin uses AdminTimeWidget to display time fields, not the TimeInput widget that you are using in your code.
There isn't a documented way to reuse the AdminTimeWidget outside of the Django admin. Getting it to work is very hacky (see the answer on this question, which is probably out of date), so it's probably better to use a different widget.
convert datetime.time(7, 0) to string work for me.
data['before'] = data['before'].strftime('%H:%M:%S')