Submitting two forms with ajax independently with Django-CodePudding

Im trying to submit two POST forms with Django using ajax, but just one of the forms has the method POST in it. I dont really know what to do here, the error is probably in the Javascript, but i dont see why the first form submit with POST method and the second doesn't, i tried to search in the internet but i think i didnt search the right question.

(sorry for my bad english)

views.py

import os
import time
from datetime import datetime

from django.http import HttpResponse, StreamingHttpResponse
from django.shortcuts import render
from utils.camera_streaming_widget import CameraStreamingWidget


# Camera feed
def camera_feed(request):
    stream = CameraStreamingWidget()
    frames = stream.get_frames()

    return StreamingHttpResponse(frames, content_type='multipart/x-mixed-replace; boundary=frame')


def detect(request):
    stream = CameraStreamingWidget()
    success, frame = stream.camera.read()
    if success:
        status = True
    else:
        status = False
    return render(request, 'detect_barcodes/detect.html', context={'cam_status': status})

def dados(request):
    if request.method == 'POST':
        name = request.POST['name'] 
        print('HELLO')

        return HttpResponse(name)

def dados_cod(request):
    if request.method == 'POST':
        cod = request.POST['cod'] 
        print(cod)

        return HttpResponse(cod)

html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" ></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <title>Detect Barcodes</title>
    <style type="text/css">
        .navbar-brand
        {
            font-size: xx-large;
        }
    </style>
</head>

<body>

    <nav  style="background-color: #3c8f56;">
        <div >
            <a  href="{% url 'detect_barcodes' %}"></a>
            <button  type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
                aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
                <span ></span>
            </button>

            <div id='NomeDoSem'><h2>Sistema de Presença</h2></div>
            
            <div >
                <button  type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
                    Nome do Seminario
                </button>
                    <ul >
                        <form id="post-name">
                            {% csrf_token %}
                            <div >
                                <input type="text"  aria-describedby="basic-addon2" id="name" name="name">
                                <div >
                                <button  type="submit">Enviar</button>
                                </div>
                            </div>
                        </form>
                    </ul>
            </div>
        </div>
    </nav>
    <div >
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW"
            crossorigin="anonymous"></script>

        {% block content %}
        {% endblock content %}
    </div>
    <br>
    <form name="post-cod">
        {% csrf_token %}
        <div >
            <input type="text"  id="cod" name="cod" style="border: 0.5px solid gray;">
            <div >
            <button  type="submit">Enviar</button>
            </div>
        </div>
    </form>

    <script text="text/javascript">
        $('#post-name').submit(function(e){
            e.preventDefault();
    
            $.ajax({
                type:'post',
                url:'{% url "dados" %}',
                data:{ 
                    name:$('#name').val(),
                    csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(),
                },
                success: function(data){
                    $('#NomeDoSem').empty()
                    $('#NomeDoSem').html('<h2>' data '</h2>')
                }
            });
        });
        
        $('#post-cod').submit(function(b){
            b.preventDefault();
    
            $.ajax({
                type:'post',
                url:'{% url "dados_cod" %}',
                data:{ 
                    cod:$('#cod').val(),
                    csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val(),
                },
                success: function(data){
                    alert('cpf')
                }
            });
        });
    </script>

</body>
</html>

CodePudding user response：

replace <form name="post-cod"> with <form id="post-cod">