2012-12-28 16 views
9

Ho questo frammento di codice in cui sto passando i dati ad un altro file jsp.Jsp ajax call using jquery

Javascript

$(document).ready(function() { 
    $("#click").click(function() { 
     name = $("#name").val(); 
     age = $("#age").val(); 
     $.ajax({ 
      type : "POST", 
      url : "pageTwo.jsp", 
      data : "name=" + name + "&age=" + age, 
      success : function(data) { 
       $("#response").html(data); 
      } 
     }); 
    });  
});  

HTML

<body> 
    Name:<input type="text" id="name" name="name"> 
    <br /><br /> 
    Age :<input type="text" id="age" name="age"> 
    <br /><br /> 
    <button id="click">Click Me</button> 
    <div id="response"></div> 
</body> 

e in pageTwo.jsp, il mio codice è

<% 
    String name = request.getParameter("name"); 
    String age = request.getParameter("age"); 
    out.println(name + age); 
%> 

ma esimo non funziona. C'è qualche errore nel mio Jquery?. Qualcuno può aiutarmi?

risposta

4
$("#click").click(function(e) { 
    // e.preventDefault(); 
    ... 
    return false; 
}); 

e, naturalmente, installare firebug o utilizzare chrome strumenti di sviluppo predefiniti (f12). apri la console ed esegui il codice.

+0

Perché "return false;" necessario? Funziona ma non capisco perché. – Gabrer

+1

"return false" per interrompere qualsiasi azione predefinita. diciamo che "#click" è un link, quindi ora quando fai clic su di esso ti reindirizzerà a una pagina (href url), ora se hai "return false", non farà l'azione predefinita del browser. "return false" è necessario inserire alla fine del codice all'interno del callback. Puoi anche usare "e.preventDefault();" che puoi inserire nella parte superiore del tuo codice all'interno della funzione di callback. – HamidRaza

+0

Grazie mille! Molto chiaro e veloce :) – Gabrer

1
$(document).ready(function() { 
    $("#click").click(function() { 
     name = $("#name").val(); 
     age = $("#age").val(); 
     $.ajax({ 
      type: "POST", 
      url: "pageTwo.jsp", 
      data: "{'name':'" + name + "','age':'" + age + "'}", 
      contentType: "application/json", 
      async: false, 
      success: function (data) { 
       $("#response").html(data.d); 
      } 
     }); 
    }); 
});