How to Send Input Text from Django Template File to Function exist in Django View using POST method in Django Application

By Posted on

Introduction

Another article about how to process an input from a user entry. Actually it is slightly different from the previous article. There is also another article exist in the previous one as an example. But in that article, the process is using a GET method. Is is the article ‘How to Send Input Text from Django Template File to Function exist in Django View using GET method in Django Application‘. On the other hand, in this article, the process is using a POST method. Before going on futher, as it also exist in that article, below is the structure of the project : 

C:\project>dir
Volume in drive C is Windows-SSD
Volume Serial Number is CA30-19A4

Directory of C:\project

09/06/2022 07:13 AM <DIR>          .
09/06/2022 10:42 AM <DIR>          ..
09/06/2022 08:19 PM <DIR>          apps
08/24/2022 09:30 AM        159,744 db.sqlite3
08/20/2022 05:17 PM            683 manage.py
08/20/2022 05:18 PM <DIR>          project
09/06/2022 07:14 AM            126 requirements.txt
3 File(s) 160,553 bytes
4 Dir(s) 65,556,508,672 bytes free

C:\project>

So, after getting in to the project folder, just get in to the ‘apps’ folder. Below is the apps folder ‘s content :

(env) C:\project\apps>dir
Volume in drive C is Windows-SSD
Volume Serial Number is CA30-19A4

Directory of C:\project\apps

09/06/2022 08:19 PM <DIR>       .
09/06/2022 07:13 AM <DIR>       ..
08/24/2022 10:02 AM         215 admin.py
08/24/2022 08:43 AM         146 apps.py
08/26/2022 02:19 PM <DIR>       migrations
08/26/2022 02:05 PM       1,548 models.py
09/06/2022 07:01 PM <DIR>       templates
08/24/2022 08:43 AM          63 tests.py
09/06/2022 08:03 AM         118 urls.py
09/08/2022 06:43 AM         871 views.py
08/24/2022 08:43 AM           0 __init__.py
09/08/2022 06:43 AM <DIR>       __pycache__
7 File(s) 2,961 bytes
6 Dir(s) 66,276,225,024 bytes free

(env) C:\project\apps>

How to Send Input Text from Django Template File to Function exist in Django View using POST method

Basically, the preparation for this article is exactly the same from the previous article ‘How to Send Input Text from Django Template File to Function exist in Django View using GET method in Django Application‘. But there is a slight different in the Django template file of ‘index.html’. And also the ‘views.py’ for defining the function in Django applicatoin for processing the POST request. Furthermore, the ‘urls.py’ file defining the URL address of the Django application’s page. Below are the steps for achieving the purpose of sending input text from a page. That page is represented by a Django template file to a function exist in Django view using POST method :

  1. First of all, the preparation will start from the front-end part. It is the page represented by a Django template file to retrieve the request to send the input text to the function exist in a function exist in the Django application. It is a file with the name of ‘index.html’ exist in the ‘templates’ folder of the ‘apps’ folder representing the application folder. Below is the  modification content of the ‘index.html’ into ‘add_department.html’ to achieve the purpose from the one exist in article ‘How to Send Input Text from Django Template File to Function exist in Django View using GET method in Django Application‘ : 

    <!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
    <form method="GET" action="{% url 'add_empployee' %}">
        <div>
            Employee Name :
            <input type="text" name="employee_name" value=""></input>
        </div>
        <button class="btn btn-primary" type="submit">Add Employee</button>
    </form>
</body>
</html>

  2. Actually, the second one as a preparation by performing modification will be the ‘urls.py’ file. Although, it is only a slight modification of the ‘urls.py’ by adding just one line for registering the URL application for processing the POST request method as follows : 

        path('add_employee/', views.add_employee, name="add_employee")

    So, the modification for the ‘urls.py’ file will be in the following appearance : 

    from django.urls import path
from apps import views
urlpatterns = [
    path('', views.index, name="index"),
    path('add_employee/', views.add_employee, name="add_employee"),
]

     

  3. Next, the third one will be the preparation for the back-end process. So, for the back-end process the ‘views.py’ file exist in the application folder representation will handle it. It is as in the URL definition which is a function with the name of ‘add_employee’. Furthermore, ‘views.add_employee’ means that the function ‘add_employee’ actually exist in the ‘views.py’ file. Below is the content of it where the focus will be in the ‘add_employee’ function : 

    def add_employee(request):
    if request.POST:
        name = request.POST.get('employee_name')
        print("Employee Name : ",name)
    else:
        print("Not a POST request")
    return render(request,"add_employee.html")

  4. After that, just execute the Django application to run as in the following execution : 

    C:\project\apps>python manage.py runserver
Watching for file changes with StatReloader
Performing system checks...
System check identified no issues (0 silenced).
September 09, 2022 - 13:45:39
Django version 4.1.1, using settings 'model.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CTRL-BREAK.

  5. Access the URL containing the page where the input exist. In this example, it exist in ‘/add_employee’ with the full URL of ‘localhost:8000/add_employee’. If there are no error messages appear, the following page will present :

    How to Send Input Text from Django Template File to Function exist in Django View using POST method in Django Application
    How to Send Input Text from Django Template File to Function exist in Django View using POST method in Django Application

  6. Soon after, just type in the text field of ‘Employee Name’. It is a trigger to start the request POST method in order to process it as in the following display :

    How to Send Input Text from Django Template File to Function exist in Django View using POST method in Django Application
    How to Send Input Text from Django Template File to Function exist in Django View using POST method in Django Application

  7. After clicking the submit button, it will then pass the text to the Django function of ‘add_employee’ exist in the ‘views.py’ file. It will then display the name where the Django application is printing it in the console as follows : 

    Employee Name : David Edgar
[10/Sep/2022 13:33:11] "POST /add_employee/ HTTP/1.1" 200 630
Not Found: /favicon.ico
[10/Sep/2022 13:33:11,833] - Broken pipe from ('127.0.0.1', 65125)

Leave a Reply