Отримання даних з JSON-запиту Django та їх відображення в HTML

5 Березня 2024 в 20:32 129

При роботі з Django виникає необхідність отримання даних з JSON-запиту та їх подальше відображення у веб-сторінці. Особливо це актуально у випадку створення форми реєстрації, де дані надходять через POST-запит, що містить JSON-структуру. У цій статті ми розглянемо процес отримання даних з JSON-запиту у Django та їх подальше відображення в HTML-формі.

Для початку, давайте розглянемо основні кроки:

Крок 1: Обробка JSON-запиту

У першу чергу, нам потрібно обробити JSON-дані, що надійшли у POST-запиті. У Django це можна зробити за допомогою модуля json. Нижче наведено приклад, як це можна реалізувати у вигляді Django-в’ю:

@csrf_exempt
def registration_form(request):
    if request.method == "POST":
        # Обробка JSON-даних
        json_data = json.loads(request.body)
        dataid = json_data.get('data_id')
        
        # Ініціалізація форми зі зчитаним dataid
        form = RegistrationForm(initial={'data_id': dataid})
                
        if form.is_valid():
            name = form.cleaned_data['name']
            department = form.cleaned_data['department']
            
            return render(request,'registration.html',{'form':form})
    else:
        # Якщо запит GET, ініціалізуємо порожню форму
        form = RegistrationForm()
        
        return render(request, 'registration.html', {'form': form})

@csrf_exempt

def registration_form(request):

if request.method == "POST":

# Обробка JSON-даних

json_data = json.loads(request.body)

dataid = json_data.get('data_id')

# Ініціалізація форми зі зчитаним dataid

form = RegistrationForm(initial={'data_id': dataid})

if form.is_valid():

name = form.cleaned_data['name']

department = form.cleaned_data['department']

return render(request,'registration.html',{'form':form})

else:

# Якщо запит GET, ініціалізуємо порожню форму

form = RegistrationForm()

return render(request, 'registration.html', {'form': form})

Крок 2: Відображення у HTML-формі

Отримавши JSON-дані та ініціалізуючи форму з цими даними, ми можемо легко відобразити їх у HTML-формі. Для цього у Django використовується шаблонний двигун, який дозволяє вбудовувати дані у HTML-шаблони. Нижче наведено приклад шаблону registration.html:

{% extends 'base.html' %}
{% load static %}
{% load widget_tweaks %}
{% block content %}
<form method="post">
    {% csrf_token %}
    {{ form.as_p }}
    <input type="submit" value="Submit">
</form>
{% endblock content %}

{% extends 'base.html' %}

{% load static %}

{% load widget_tweaks %}

{% block content %}

{% csrf_token %}

</form>

{% endblock content %}

Крок 3: Додаткові налаштування форми

У випадку, якщо ви хочете здійснити додаткову настройку HTML-форми, таку як додавання CSS-стилів або JavaScript, вам необхідно використовувати відповідні інструменти у Django. Також ви можете налаштувати форму у файлі forms.py, як показано нижче:

class RegistrationForm(forms.Form):
    dataid = forms.CharField(label='Data ID', max_length=100)
    name = forms.CharField(label='Name', max_length=100)
    department = forms.CharField(label='Department', max_length=100)

class RegistrationForm(forms.Form):

dataid = forms.CharField(label='Data ID', max_length=100)

name = forms.CharField(label='Name', max_length=100)

department = forms.CharField(label='Department', max_length=100)

Зверніть увагу, що вам необхідно додатково налаштувати шаблони, якщо ви хочете змінити відображення полів форми у HTML.

Висновок

Отримання даних з JSON-запиту та їх відображення у веб-сторінці за допомогою Django є досить простим процесом. Використовуючи відповідні методи Django для обробки JSON-даних та шаблонний двигун для відображення цих даних у HTML, ви можете легко створити функціональну форму реєстрації, яка відповідає вашим потребам.