How to set value to django-select2 field Programmatically (on button click) using javascipt?

[eruiz67]

Goal
In my django app I have a WorkerModel and a ProvinceModel, each worker has a province_id field. I have define a form for Worker using ModelSelect2Widget (django_select2) for province_id. I want to know how to set a value to province_id field using javascript. The idea is that when a button is clicked we make an ajax request getting the id and name of the province and I want to set the value of province_id to the province id I just got

Code Snippet

from django_select2.forms import ModelSelect2Widget
class WorkerForm(forms.ModelForm):
    
    class Meta:
        model = WorkerModel
        exclude = ("id",)
        widgets = {
            'name':forms.TextInput(attrs={'class': 'form-control'}),
            'province_id' : ModelSelect2Widget(model=ProvinceModel, queryset=ProvinceModel.objects.filter(),
                                            search_fields=['des_prov__icontains'],
                                            attrs={'style': 'width: 100%;'}),

}

in the template

    <script>
//on a button click a want to set the value of province_id
     $(document).ready(function () {
    
                $('#id_province_id').djangoSelect2({
                    placeholder: 'Seleccione una opción',
                    escapeMarkup: function (markup) { return markup; },
                    language: {
                        noResults: function () {
                            return "No se encuentran resultados.";
                        }
                    }
    
     });
                });
    </script>

[codingjoe]

Hi @eruiz67,

I believe this question can be better answered by the select2 community, since it's not Django related.

Best,
Joe