Django – How to add multiple submit button in single form?
When we submit the data using the HTML form, it sends the data to the server at a particular URL which is defined in the action attribute. To perform different actions with a single HTML form, we just need to add multiple submit buttons in the form. For example, If you go through the code of the newsletter app, you will find subscribe and unsubscribe buttons in a single HTML form but both perform different actions.
In this tutorial, we are going to make a newsletter app using Django. We will add subscribe and unsubscribe buttons in a single HTML form. Moreover, We will add or remove the email address of the user from our database according to the user clicks on the subscribe or unsubscribe button.
To create the simple newsletter Django app, follow the below steps.
Create a new Django project
To start a new Django project, your local computer should be satisfied with the prerequisites are given above. Users can use the below command to start a new project.
django-admin startproject newslatter
Next, Go to the project directory.
Start a newsletter app
To start a new app inside the newsletter project, run the below command inside the project directory.
django-admin startapp appnewslatter
Now, add “appnewslatter” inside the installed_apps section in settings.py of the newsletter project.
Next, Edit the urls.py inside the newsletter folder and add the below code.
Create a new urls.py file inside the “appnewslatter” folder. Now, your project directory should look like the below image.
Edit the urls.py inside the appnewslatter folder. We are adding the URL for the home page.
Create a “templates” folder inside the appnewslatter folder to store the HTML templates.
Create a news.html file inside the templates folder to add a form for our newslatter app.
Add the below code inside the news.html file which includes a single form with 2 submit buttons. Every submits button has a unique name. In the views.py file, We will identify from which button users have sent the post request using the name of the button.
Now, we need to create a table in the database to store the email of the users. We will edit the models.py file.
Register the created model inside the admin.py file.
After registering the model, we need to migrate it. Users need to run the below 2 commands one by one.
python manage.py makemigrations python manage.py migrate
Now, we will edit the views.py file and add the code to handle requests from subscribe and unsubscribe buttons. Here, we check that from which submit button we get the post request with the help of the name attribute of the button.
if 'name_of_button' in request.POST: # perform some action
if 'subscribe' in request.POST: # add the user email in database if 'unsubscribe' in request.POST: # remove the user email from database
Copy/paste the below code inside the views.py file.
Finally, we have created a simple newsletter app and learned about how we can add multiple submit buttons in a single HTML form. Let’s run the project and see the output. Users can run the Django app using the below command.
Python manage.py runserver