Jquery function not defined with onclick attribute set inside django forms (forms.py)

问题

I have a django form with onclick attribute set to a jQuery function located inside a .JS file and I want that function to be called whenever the onclick event is triggered . When I click on the form , it says my function is not defined . Maybe the answer is easy and obvious but I'm kind of newbie in both jQuery and Django .I have googled it around but still can't work this out .

Any help would be great .

forms.py

class UserProfileForm(forms.ModelForm):
    class Meta:
        model = Profile
        fields = (
           'nationality'
) 
        widgets = {
            'nationality': forms.TextInput(attrs={'placeholder': 'Your Country Name ...', 'onclick': 'autocompleteCountry()' }),
}

index.js

$(document).ready(function(){
   function loadAutocomplete(id, country){
    $(function(){
      $(id).autocomplete({
        source: country
      });
    });
  }

  function autocompleteCountry(country){
    loadAutocomplete('#id_nationality', country);
  }
};

index.html

<form method="post">
                        {% csrf_token %}
                            <div class="fieldset">
                                {% for field in f %}
                                        {{ field|as_crispy_field }}
                                {% endfor %}
                            </div>
</form>

来源：https://stackoverflow.com/questions/45264701/jquery-function-not-defined-with-onclick-attribute-set-inside-django-forms-form