Editing django forms using django bootstrap forms

Question

I am working with django forms and am using django bootstrap form( https://django-bootstrap-form.readthedocs.org/en/latest/ ) for UI. I am able to create forms in html using the django bootstrap form. Now the problem is that i want to edit the forms and update the record in the database.

My question is how can i use the django bootstrap form to provide a form for editing

for eg: i am using

<form role="form" action="/abc/" method="POST">{% csrf_token %}
           <div class="form-group">
              {{ form.name.errors }}
              {{ form.name|bootstrap }}
           </div>
</form> 

this is the form when filling for the first time. When i click on the edit option i want the same UI but with value="the_value_saved_in_the_database" something like

{{ form.name|bootstrap value="_data_"}}

How can i achieve it? Hope you understand the problem.

Thanks in advance

Answer 1

You need to load the form with data (called binding the form) before you render it. If the form represents some data that you have stored in the model, then create a ModelForm and pass in the model instance for which you want to edit the data.

Here is an example:

class AddressBook(models.Model):
    name = models.CharField(max_length=200)
    email = models.EmailField()

class AddressForm(forms.ModelForm):
    class Meta:
        model = AddressBook

def edit_address(request, pk=None):
    existing_entry = AddressBook.objects.get(pk=pk)
    form = AddressForm(instance=existing_entry)
    return render(request, 'edit.html', {'form': form})

In urls.py :

url('^address/edit/(?P<pk>\d+)$', 'edit_address', name="edit"),
url('^address/save/$', 'save_address', name="save"),

Now, when you call your view http://localhost:8000/address/edit/1 , the form will be populated by the data for the entry whose primary key is 1 ready for editing. In your template, simply render the form, and point it to the save view:

<form method="post" action="{% url 'save' %}">
    {% csrf_token %}
    {{ form|bootstrap }}
</form>

If you are going to be doing this often, its easier to use the generic class based views (like CreateView , EditView ) to simplify your code.