CODEWITHSUNDEEP
djangoformsinputmodelform
sgt_pepper85
sgt_pepper85

Reputation: 441

How do I pass the value of two separate inputs into the content field of my form in Django?

In my template I have a form that includes two input elements whose values can be adjusted with javascript. I want to be able to take these values and, on form submit, display them in a sentence in a for loop underneath.

index.html:

<form action="{% url 'workouts:workout' %}" method="post">
    {% csrf_token %}
    <div class="weight">
        <h4>WEIGHT (kgs):</h4>
        <button type="button" class="weight-dec">-</button>
        <input type="text" value="0" class="weight-qty-box" readonly="" name="one">
        <button type="button" class="weight-inc">+</button>
    </div>
    <div class="reps">
        <h4>REPS:</h4>
        <button type="button" class="rep-dec">-</button>
        <input type="text" value="0" class="rep-qty-box" readonly="" name="two">
        <button type="button" class="rep-inc">+</button>
    </div>
    <input type="submit" value="Save" name="submit_workout">
    <input type="reset" value="Clear">
</form>

{% if exercise.workout_set.all %}
    {% for w in exercise.workout_set.all %}
        {{ w.content }}
    {% endfor %}
{% endif %}

I have given the form above an action attribute for a url which maps to a view, and each of the inputs has a name in order to access their values in the view. I also have written this form in forms.py:

class WorkoutModelForm(forms.ModelForm):
    class Meta:
        model = Workout
        fields = ['content']

And for context, here is my model:

class Workout(models.Model):
    content = models.CharField(max_length=50)
    created = models.DateField(auto_now_add=True)
    updated = models.DateField(auto_now=True)
    exercise = models.ForeignKey(Exercise, on_delete=models.CASCADE, default=None)

    class Meta:
        ordering = ('created',)

My problem from here is that I have no idea how to actually incorporate my model form in my template, or how to write a view that will do what I want it to. I am still new to this and have been searching for an answer for sometime, but so far have not found one. Please help.

Upvotes: 0

Views: 276

Answers (1)

Marvin Correia
Marvin Correia

Reputation: 871

This is able to help you, you should first have a look at the django Class-Based Views , more specifically the FormView, django already has generic views capable of handling data posted on forms. Your code would look like this:

# forms.py
# imports ...
class WorkoutModelForm(forms.ModelForm):
    class Meta:
        model = Workout
        fields = ['content']


# urls.py
from django.urls import path
from . import views
app_name = 'myapp'

urlpatterns = [
    path("test-form/", views.TesteFormView.as_view(), name='test-form'),
]


# views.py
from django.views.generic import FormView
from myapp import forms
from django.contrib import messages

class TesteFormView(FormView):
    template_name = "myapp/index.html"
    success_url = reverse_lazy('myapp:test-form')
    form_class = forms.WorkoutModelForm

    def get(self, request, *args, **kwargs):
        return super(TesteFormView, self).get(request, *args, **kwargs)

    def form_valid(self, form):
        print(f"POST DATA =  {self.request.POST}") # debug
        content = form.cleaned_data.get('content')
        # fieldx= form.cleaned_data.get('fieldx')
        # do something whit this fields like :
        Workout.object.create(content=content)
        messages.success(self.request,"New workout object created")

        return super(TesteFormView, self).form_valid(form=self.get_form())

    def form_invalid(self, form):
        print(f"POST DATA =  {self.request.POST}") # debug
        for key in form.errors:
            messages.error(self.request, form.errors[key])
        return super(TesteFormView, self).form_invalid(form=self.get_form())

And your template would look like:

# myapp/index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TestForm</title>
</head>
<body>
<form method="post">
    {% csrf_token %}
    {{ form }}
    <button type="submit">submit</button>
</form>
</body>
</html>

Upvotes: 1

Related Questions