4

I'm trying to add some conditional logic in my Django model form, and it's much more difficult than I'd anticipated. What I want to do is : if a user selects option A, I'd like one more question to be shown, and if they choose option B, I'd like another question to be shown.

I found this answer -- this is exactly what I want, it says to start with making the fields that have optional values (i.e. not required) and then use Javascript to hide the fields, according to the logic. But it doesn't explain how.

I think I can figure out the JS bit but what I'd like to understand is how and where to add this. I'd assume in forms.py, in a widget attrs maybe? I'd love an implementation sample if that's possible. Thanks a lot in advance!

Community
  • 1
  • 1
Mangoshaker
  • 43
  • 1
  • 4

1 Answers1

5

As you've already mentioned, the most simple way to do what you want is to create a form with all fields (required & optional) and to make some of them be invisible until you want them appear (by selecting some option in other field for example). To do this you should:

  1. Create a form with all fields you want in forms.py.

    Class MyForm(forms.Form):
    #fields go here

  2. Pass the form to a desired template.

    def myview(request):
    form = MyForm()
    c = {'form': form}
    return render(request, 'mytemplate.html', c)

  3. Render the form in a template.

    <form action="/your-name/" method="post">
    {% csrf_token %}
    {{ form }}
    <input type="submit" value="Submit" />
</form>

  4. Now all magic goes in a .js file. It likely should be in /static/js/ folder and can be named as you wish. Select the fields you want to make invisible by id (jQuery will make it easier to select fields in some other manner, by class for example) and hide them with .hide() method. Alternatively, you may want to hide necessary fields in css by setting their visibility to hidden. At last the only thing you should do is to write a condition in .js file to check if some required field is checked or what option is selected and show some optional hidden fields with .show() method. Imagine, you have a checkbox with id="mycheckbox":

    <script type="text/javascript">
    if (document.getElementById('mycheckbox').checked) {
        document.getElementById('someotherfield').show();
    }
</script>

Of course, there are other ways to make dynamic forms.

chem1st
  • 1,624
  • 1
  • 16
  • 22
  • Thanks, chem1st. I've done steps 1, 2 and 3. How do I give the fields the id? If it's a CharField with 2 choices, say, "yes" and "no", how do I set the logic "if the answer is yes, do this"? – Mangoshaker Feb 24 '16 at 02:23
  • Django forms already have built-in ids - [check this out](https://docs.djangoproject.com/en/1.9/topics/forms/#building-a-form-in-django). – chem1st Feb 24 '16 at 10:12
  • The problem was that I didn't realize django forms had built-in ids, and all the while I was wondering how to get the js working! Thanks again! – Mangoshaker Feb 25 '16 at 09:34