jquery - JavaScript alertbox if Django form missing fields -

i implement jquery elements in django website application render dynamical.

for exemple, users filling form , alertbox appears depending if django form filled or not.

• if django form filled it'll give : "form has been created"

• if django form not correctly filled it'll give : "please, form"

i tried things , html file looks :

    <form class = "form" method='post' action=''> {% csrf_token %}         <br></br>         {{ form.as_p}} <!-- display child part formulary -->         <br></br>          <button onclick="myfunction()">valider le formulaire</button>     </form>          {% if form.is_valid %}         <script>         function myfunction() {             alert("le formulaire été créé");         }         </script>         {% else %}         <script>         function myfunction() {             alert("le formulaire n'a pas été créé car champ(s) invalide(s)");         }         </script>         {% endif %} 

my view looks :

def birthcertificate_form_unique_number(request) :      validity = []     #user fill fields     query_social_number = request.get.get('social_number')     query_social_number_father = request.get.get('social_number_father')     query_social_number_mother = request.get.get('social_number_mother')      if request.method == 'post':          form = birthcertificateform2(request.post or none)          if form.is_valid() :   # vérification sur la validité des données             post = form.save()             return httpresponseredirect(reverse('bc_treated2', kwargs={'id': post.id}))      ... 

how write alertbox in files ?

thank !

ps : new jquery. first time i'm using it

edit :

i tried this, none alert appears :

<form class = "form" method='post' action=''> {% csrf_token %}                 <br></br>                 {{ form.as_p}} <!-- display child part formulary -->                 <br></br>                  <button type="input">valider</button>             </form>               <script type="text/javascript" >                 $(document).on('valider', 'form.form', function(form) {                 var $form = $(form);                 $.ajax({                     url:"/path_to_directory/bc_form2.html",                     type: "post",                     success: function(form) {                     alert("l'acte de naissance été créé");                     }                 });                 });             </script> 

you can use ajax submit data view validate data , return json of response. after can show alert based on return. can use $.ajax(), $.get(), $.post() , other function based on need. make sure can handle data in ajax based on response view.

updated

for edit case have know more jquery. instead of

$(document).on('valider', 'form.form', function(form)

you should

$(document).on('event', 'selector', function(form)

for event kind of input or happen handle, example when want handle click use click or change can use change.

for selector kind of id, class or other type got html element. in case if want use click event code like

$(document).on('click', '.btn-validate', function(e){     var form = $(".form").serialize();     $.ajax({         url: "url_on_your_view , registered in url.py",         type: "post",         success:function(response){             alert("l'acte de naissance été créé");         }     }); } 

for button have update to

<button type="input" class="btn-validate">valider</button>