Tutorial de Ajax para publicar y obtener [cerrado]

99

Necesito un tutorial simple de ajax o un estudio de caso para un formulario de entrada simple, donde quiero publicar un nombre de usuario a través de un formulario de entrada, que lo envía a la base de datos y responde con los resultados.
Cualquier recomendación para este tutorial es bienvenida, porque solo tengo uno usando Mootool, ¡pero estoy buscando uno usando jQuery!

Reham Fahmy
fuente

Respuestas:

167

Puedes probar esto:

$.ajax({
  url: "test.html",
  cache: false,
  success: function(html){
    $("#results").append(html);
  }
});

Este código agregará el contenido del test.htmlarchivo al #resultselemento

Puede encontrar más información en el sitio web de jQuery .

Actualizar:

Utilice este código para enviar datos POST y generar resultados.

var menuId = $("ul.nav").first().attr("id");
var request = $.ajax({
  url: "script.php",
  type: "POST",
  data: {id : menuId},
  dataType: "html"
});

request.done(function(msg) {
  $("#log").html( msg );
});

request.fail(function(jqXHR, textStatus) {
  alert( "Request failed: " + textStatus );
});
apis17
fuente
39

Suponiendo que tenga un html como:

<input type="text" name="username" id="username">
<div id="resultarea"></div>

Usarías un me <script>gusta:

var myusername = $("#username").val();
$.ajax({
  type: "GET",
  url: "serverscript.xxx",
  data: myusername,
  cache: false,
  success: function(data){
     $("#resultarea").text(data);
  }
});
shaun5
fuente
6
Es posible que deba establecer el nombre del parámetro, como datos: "username =" +
myusername
también puede hacer ajax para algunos casos con esta biblioteca github.com/Guseyn/EHTML , usando solo HTML
Guseyn Ismayylov