Comment est-il possible que Request.IsAjaxRequest () est vrai de Firefox, mais faux de IE lors de l'utilisation post jquery

Question

Je suis en train de tester après jquery. Je posterai une forme et que vous souhaitez mettre à jour en ajax et le remplacer par une forme de réussite sur une div (qui semble être un cas d'utilisation commune).

Le code suivant fonctionne très bien dans Firefox, mais pas dans IE.

Un problème est que de Firefox Request.IsAjaxRequest () est vrai, mais venant de IE, Request.IsAjaxRequest () est de retour false

NOTE: je mets dans le Thread.Sleep dans mon action du contrôleur comme un test pour vérifier que je peux voir ce qui se passe

.

Voici mon code de la vue:

 <div id="contact">
   <form action="/Tracker/Add" method="post">
    <fieldset id="inputbox">
       <p>

        <label>Today's number</label>   <input class="inputText" id="weight" name="weight" type="text" value="208" /></p>
        <p><label>Today's Date</label>     <input class="inputText" id="datepicker" name="date" type="text" value="03-Mar-2010" /></p>
        <p><input type="submit" value="Enter" /></p>
    </fieldset>

 

et voici le javascript / code jquery:

<script type="text/javascript" src="../../Scripts/jquery/1.3.2/jquery-1.3.2.min.js"></script>

 <script type="text/javascript">
    $(document).ready(function() {
    $('#contact form').live('submit', function() {

            //$("#Loading").fadeIn(); //show when submitting

            $.post($(this).attr('action'), $(this).serialize(), function(data) {
                $("#contact").replaceWith($(data));
            });
            return false;
        });
    });
</script>

et voici mon action du contrôleur:

    public ActionResult Add()
    {
         if (if (Request.IsAjaxRequest())
         {
                  //firefox will hit this but IE wont
          }


        Thread.Sleep(5000);
        return PartialView("EntryView", new MyViewModel());
    }

Answer 1

J'ai vérifié que votre code (dans lequel je ne pouvais pas trouver une erreur) n'a pas été l'envoi d'une requête XHR avec jQuery 1.3.2 et IE 6.0.2900.5512; la mise à niveau jQuery pour la prochaine version disponible, 1.4.0, fixe le comportement cassé. Avec 1.4.0 (et au-dessus), IE affiche la forme en utilisant AJAX et envoie le X-Requested-tête avec requis pour IsAjaxRequest() travailler. Êtes-vous capable de mettre à niveau jQuery? Je ne l'ai pas eu de chance de trouver le bug spécifique / correctif pour cela, mais si vous avez besoin de rester avec 1.3.2, je peux continuer à creuser.

Answer 2

Ajoutez le code suivant, juste après le code jQuery:

jQuery.ajaxSetup({
    beforeSend: function(xhr) {
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
    }
});

Il force le navigateur à ajouter le X-Requested-With en-tête pour chaque requête AJAX.

A noter que l'utilisation de la dernière version de jQuery est recommandé car il y a beaucoup de corrections de bugs.

Si cela ne fonctionne pas, s'il vous plaît inspecter la demande avec Fiddler pour voir si IE envoie l'en-tête ou non.

Answer 3

On dirait qu'il ya une erreur javascript qui se passe dans IE qui empêche d'appeler l'action de manière asynchrone. Vérifiez la présence de l'en-tête HTTP X-Requested-With: XMLHttpRequest pendant le débogage.