Problème pour obtenir la page avec JQuery?

Question

Bonjour J'ai deux fichiers aspx, l'un d'eux est Default.aspx et l'autre est Insert.aspx.

Insert.aspx attend deux paramètres nommés prénom et nom de famille, et enregistre ces valeurs dans la base de données, et écrit un message de bienvenue comme 'Bienvenue John Stinger'.

Default.aspx contient un formulaire simple, deux zones de texte et un bouton (txtFname, txtLname, btnInsert) et une division pour afficher le message.

J'écris un code JQuery dans Default.aspx :

  $(document).ready(function() {
    $('#btnInsert').click(function() {
      $.ajax({
        contentType: "text/html; charset=utf-8",
        data: "firstname=" + $('#txtFname').val() + "&lastname=" +$("#txtLname").val(), 
        url: "Insert.aspx",
        dataType: "html",
        success: function(data) {
          $("#message").html(data);
        }
      });
    });
  });

Je veux obtenir la page Insert.aspx et la charger dans la division #message mais je ne peux pas obtenir la page. Que puis-je faire?

Merci..

Answer 1

  $(document).ready(function() {
    $('#btnInsert').click(function() {
      $("#message").load("Insert.aspx", { firstname : $('#txtFname').val(), lastname : $("#txtLname").val() } );
    });
  });

En savoir plus : http://docs.jquery.com/Ajax/load#urldatacallback

Answer 2

Votre code semble être correct, comme Cesar l'a dit, vous l'avez correctement débogué...

Assurez-vous que toutes les zones clés fonctionnent, comme

le clic sur le bouton est-il déclenché ?

l'appel ajax s'est-il terminé avec succès ?

les valeurs des zones de texte sont-elles correctement récupérées ?

Votre insertion est-elle un succès ? etc...

Je voudrais expliquer un peu plus, étant donné que vous êtes nouveau ici (moi aussi :-) )

    $(document).ready(function() {
        $('#btnInsert').click(function() {
            alert("Cliqué"); // bouton cliqué
            $.ajax({
                contentType: "text/html; charset=utf-8",
                data: "firstname=" + $('#txtFname').val() + "&lastname=" + $("#txtLname").val(),
                url: "Insert.aspx",
                dataType: "html",
                success: function(data) {
                    alert("Succès..."); // L'appel ajax s'est terminé avec succès
                    alert(data);
                    $("#message").html(data);
                }
            });
            return false; // vous ne voulez pas de rechargement de la page actuelle!!!
        });
    });
</code></pre>

<p></p>

<p>J'ai ajouté quelques alertes dans votre code, votre code est bon si tout s'affiche...</p>

<p>Veuillez modifier votre code Insert.aspx.cs comme mentionné ci-dessous</p>

<pre><code>protected void Page_Load(object sender, EventArgs e)
    {
        //code pour valider les entrées et insérer
        Response.Write("succès"); // votre message
        Response.End(); // pour vider le buffer 
    }
</code></pre>

<p>Faites-moi savoir si cela vous a aidé ou non...</p>

<p>Santé</p></x-turndown>