2

Je travaille sur ce site web qui nécessite un formulaire de contact jquery/ajax. Tout fonctionne bien, sauf pour IE7 (et probablement IE6, 8 et peut-être même 9), mais le soutien pour ceux-ci n'a pas été demandé/prévu/nécessaire. Voici la version live:Le formulaire Jquery/Ajax ne fonctionne pas sur IE7

http://njutsu.net

Dans tous les cas, voici le code JQuery:

<!-- JS --> 
    <script type="text/javascript" src="scripts/jquery.js"></script> 
    <script> 
function valid_email(email) { 
    if (!(/^[A-Z0-9._%+-][email protected][A-Z0-9.-]+\.[A-Z]{2,4}$/i).test(email)) 
     return false; 

    return true; 
} 


$(function(){ 
$("#testclass").submit(function(){ 


if (!valid_email($('#email').val())) { 
    alert('Por favor escribe un email valido.'); 
    $('#email').focus(); 

    return false; 
} 

if ($('#nombre').val().length == 0) { 
    alert('Por favor escribe tu nombre.'); 
    $('#nombre').focus(); 

    return false; 
} 

if ($('#apellido').val().length == 0) { 
    alert('Por favor escribe tu apellido.'); 
    $('#apellido').focus(); 

    return false; 
} 

if ($('#edad').val().length == 0) { 
    alert('Por favor escribe tu edad.'); 
    $('#edad').focus(); 

    return false; 
} 

if ($('#telcel').val().length == 0) { 
    alert('Por favor escribe tu telefono o celular.'); 
    $('#telcel').focus(); 

    return false; 
} 

if ($('#razon').val().length == 0) { 
    alert('Por favor escribe la razon por la cual deseas tomar una clase de prueba.'); 
    $('#razon').focus(); 

    return false; 
} 






    $.ajax({url: "testclass.php", 
    datatype: 'html', 
    type:'POST', 
    data: { "email": $("input[type=text][name=email]").val(), 
      "nombre": $("input[type=text][name=nombre]").val(), 
      "apellido": $("input[type=text][name=apellido]").val(), 
      "edad": $("input[type=text][name=edad]").val(), 
      "telcel": $("input[type=text][name=telcel]").val(), 
      "razon": $("textarea#razon").val(), 
      }, 
    success: function (response,textstatus){ 
    $("#secondary div.col1-2").html("<h4 class='thanks'>Gracias por enviar tu solicitud, nos pondremos en contacto apenas leamos tu mensaje para acordar una fecha y hora para tu clase de prueba.</h4>"); 
    $("#secondary div.col1-2").hide(); 
    $("#secondary div.col1-2").fadeIn(2000); 
    } 
    }); 
    return false; 
}); 



}); 


</script> 

Et voici le code HTML de la forme:

<form id="testclass" action="testclass.php" method="post"> 
      <div class="row"> 
       <label>Tu E-Mail</label> 
       <input id="email" name="email" class="text" type="text"> 
      </div> 
      <div class="halfrow left"> 
       <label>Tu Nombre</label> 
       <input id="nombre" name="nombre" class="text" type="text"> 
      </div> 
      <div class="halfrow"> 
       <label>Tu Apellido</label> 
       <input id="apellido" name="apellido" class="text" type="text"> 
      </div> 
      <div class="halfrow left"> 
       <label>Tu Edad</label> 
       <input id="edad" name="edad" class="text" type="text"> 
      </div> 
      <div class="halfrow"> 
       <label>Tu Teléfono o Celular</label> 
       <input id="telcel" name="telcel" class="text" type="text"> 
      </div> 
      <div class="row"> 
       <label>Razón por la cual deseas tomar clases de Ninjutsu Instintivo</label> 
       <textarea id="razon" name="razon" class="textarea" cols="" rows=""></textarea> 
      </div> 
      <div class="row"> 
       <h5><input class="button" type="submit" value="Quiero tomar una clase de prueba" /></h5> 
      </div> 
</form> 

Dans tous les cas, Si les zones clés du formulaire ne sont pas "remplies" lors de leur soumission, il y a une vérification PHP qui vous amène à /iefail.php et vous le fait savoir.

Je suis nouveau à Jquery et n'ai donc aucune connaissance solide du pourquoi derrière les problèmes d'incompatibilité de IE7 avec Jquery autre que connaissant la famille de navigateurs IE si la disgrâce de l'Internet. Toute aide est appréciée.

P.S. J'ai vérifié et j'ai javascript activé sur IE7, juste au cas où vous vous demandiez.

Toute aide/conseils est appréciée

Répondre

4

Il est la virgule supplémentaire à la fin de votre objet data qui est à l'origine IE à échouer lamentablement:

data: { "email": $("input[type=text][name=email]").val(), 
     "nombre": $("input[type=text][name=nombre]").val(), 
     "apellido": $("input[type=text][name=apellido]").val(), 
     "edad": $("input[type=text][name=edad]").val(), 
     "telcel": $("input[type=text][name=telcel]").val(), 
     "razon": $("textarea#razon").val(), <-- here 
     }, 
+0

je vais le signaler. Aussi, est-il correct d'avoir les guillemets autour des noms des paires nom/valeur dans l'objet de données? –

+0

Je ne pense pas que ce soit important. Cela dit, je le teste maintenant maintenant de toute façon. – karim79

+0

@Aaron - confirmé - ce n'est pas grave. – karim79

Questions connexes