Django does not validate changed fields in the client by JS

Asked

Viewed 380 times

2

My project has a form that one of the fields is object list (Courses), but these objects are being passed from another list (Courses of the area) through Javascript, only that the values allocated with JS to the main list (Courses) do not pass the validation phase of Modelform. Follows the code:

    class EntidadeForm(forms.ModelForm):
        area = forms.ModelChoiceField(
            label='Área',
            queryset=Area.objects.all(),
            required=False,
            empty_label='Selecione uma Área',
            widget=forms.Select(attrs=
                                {'onchange': "filtraCursosCad();"}
                                )
        )
        cursos_da_area = forms.ModelMultipleChoiceField(
            label='Cursos da Área',
            queryset=Curso.objects.none(),
            required=False,
            widget=forms.SelectMultiple(attrs=
                                {'onclick': "adicionaCurso();"}
                                )
        )
        class Meta():
            model=Entidade
            fields=['area','cursos_da_area',
                    'cursos',Outros atributos da entidade...]

        def __init__(self,*args, **kwargs):
            super(VagaForm, self).__init__(*args, **kwargs)
            self.fields['cursos'].queryset = Curso.objects.none()

JS Code:

//Código que filtra a lista 'mãe'    
function filtraCursosCad(){
        area_id=document.getElementById('id_area').value;
        $.ajax({                       

            url: '/entidade/ajax/carrega_cursos/',
            data: {
              'area': area_id,      
              csrfmiddlewaretoken: '{{ csrf_token }}'
            },
            success: function (data) {   
              $("#id_cursos_da_area").html(data);  
            }
        });
    }
    //Código que adiciona o curso
    function adicionaCurso(){
        $("#id_cursos").append( $("#id_cursos_da_area option:selected"));
    }

Code used in the view:

class EntidadeCriar(CreateView):
    model=Entidade
    form_class =EntidadeForm

    def form_valid(self,form):
        entidade=form.save(commit=False)
        entidade.empresa=self.request.user.empresa
        entidade.save()
        return redirect('entidade_empresa')

Solution

Following what @Eric Chiesse said I changed the field fill code of courses that now looks like this:

self.fields['cursos'].queryset = Curso.objects.all()

Also based on his reply I went to assemble a JS code to "clear" the field at the time the page is loaded, so I found the event onload and then I tried to link it to the Select component of HTML but I was unsuccessful and searching found that this event is not available for all html tags(here), so I made an onload call on the body that looked like this:

<body onload="zeraCursos()">

and the JS code went like this:

function zeraCursos(){
    var cursos=document.getElementById("id_cursos");

    for(var i = cursos.options.length - 1 ; i >= 0 ; i--){
        cursos.remove(i);
    }
}
  • You have verified what kind of information you are sending to the server (Browser/Network Console) and what is coming to it (request.POST)?

  • Face by what I looked in the network tab of Firefox is an "array" of integers, for testing purposes I created another manytomany entity in the form of the normal way and in the post the selected values were similar to the changed array

  • Hello hello, can you share your models of the objects and where you have the validation of if form.is_valid():? Share the most complete code possible so we can help you more closely.

  • I will edit to add more information here

  • Hi on the entity line=form.save(commit=False), put a break point, inspect the "form" and share the attributes you receive when you do POST. Another question, where denfines what HTML partial you will use in the form in the Entidadecriar(Createview) class: you are not defining, you are defining in the.py urls?

  • You have to confirm if the Fields that returns in "form", (debugging), and if you match with Fields=['area','cursos_da_area',...etc] since you don’t share all the code, it will be difficult to get a 100% response, I suggest you share your project in gihhub and share, for faster help, this is if you can share your public repository project.

  • You realize that the model in your View is typed wrong Endidade?

  • It was just a misspelling, I just corrected thank you.

Show 3 more comments

1 answer

1


The validation problem occurs because you are putting queryset=Curso.objects.none() in cursos_da_area = forms.ModelMultipleChoiceField.

queryset values are used exactly to validate user input. When you specify queryset to Curso.objects.none() validation will always fail because there are no values for the backend to compare your input.

The best is to specify in queryset the exact values for validation and work your template to initially display an empty list. A quick solution is to do this via javascript. So when you post for the values contained in your page, even if they are dynamic, they will already be contained in the validation queryset.

Try to make queryset=Curso.objects.all(). Probably will be enough.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.