Ajax formulaire recharge la page au lieu d'appeler le code ajax

Question

J'essaye d'exécuter du code php sans actualiser la page en utilisant un formulaire et Ajax. Mais il rafraîchit simplement la page sans même essayer d'exécuter la fonction ajax. Il devrait y avoir quelque chose de simple manque, parce que ce même code a travaillé pour d'autres formes, même sur la même page (avec des noms différents)

formulaire HTML:

<form class='ajax_file_remove_form'> 
    <input type='hidden' name='ind' value='0'> 
    <input type='hidden' name='type' value='image'> 
    <input type='submit' class='ajax_file_remove_form_submit' name='remove_file' 
    value='Remove' style='height: 100%'> 
</form> 

fichier Javascript, à l'intérieur $(document).ready(function() {});:

$('.ajax_file_remove_form').off().on("submit", function (e) { 
    console.log("ATTEMPT AJAX FILE REMOVE"); 
    e.preventDefault(); 
    e.stopImmediatePropagation(); 
    var form = $(this); 
    var data = new FormData(form[0]); 

    $.ajax({ 
      url: "../ajax_file_remove.php", 
      type: "POST", 
      cache: false, 
      contentType: false, 
      processData: false, 
      data: data, 
      success: function (data) { 
       console.log("AJAX FILE REMOVED"); 
       console.log(data); file_preview(data); 
      } 
     }); 
}) 

La console dit que naviguées mySite.com/?ind=0~~V~~singular~~3rd & type = l'image & remove_file = Supprimer

au lieu de TENTATIVE AJAX FICHIER RETIRER

J'ai essayé de rendre la méthode de forme = « post », mais il reste rafraîchi la page, et la fonction ajax dit déjà « POST »

également essayé $ ('.ajax_file_remove_form_submit'). off(). on ("clic", fonction (e) ou pour supprimer le .off() ou d'autres choses dont je ne suis pas sûr sont nécessaires ici.

Merci :)

Answer 1

Selon la documentation - http://api.jquery.com/off/

.off() Remove an event handler. 

fonction .off() est mal placée dans

$('.ajax_file_remove_form').off().on("submit", function (e) { 

Je pense que vous devriez mettre ou utiliser la fonction .off si ce ajax est réussi.

$.ajax({ 
     url: "../ajax_file_remove.php", 
     type: "POST", 
     cache: false, 
     contentType: false, 
     processData: false, 
     data: data, 
     success: function (data) { 
      console.log("AJAX FILE REMOVED"); 
      console.log(data); file_preview(data); 
     } 
    });