cómo enviar un objeto json del servidor jsp y recibir una respuesta en jsp

Mi java server recibe JSON de JSP y hacer alguna operación y trato de enviar un objeto JSON a JSON de la siguiente manera:

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException 
{

    JSONObject newObj = new JSONObject();

    try {
        newObj = new JSONObject(request.getParameter("jsonData"));
    } catch (JSONException e) {
        e.printStackTrace();
    }

    int  val2 = 0;
    int val1 = 0;

    try {
        val2 = Integer.parseInt(newObj.getJSONObject("mydata").getString("number2"));
        val1 = Integer.parseInt(newObj.getJSONObject("mydata").getString("number1"));
    } catch (JSONException e) {
        e.printStackTrace();
    }

    System.out.println(val2 + val1);
    Double d =  Math.pow(val1, 2);

    PrintWriter writer = response.getWriter();
    JSONObject obj=new JSONObject();

    try {
        obj.put("results",d);
        obj.put("resultText","foo");
    } catch (JSONException e) {
        e.printStackTrace();
    }

    writer.println(obj);
    writer.flush();
    System.out.println(d);
}

Mi JSP donde puedo enviar JSON del servidor de e intente recibir un objeto JSON de respuesta desde el servidor

<body>
   <h3>Please enter a number to Square : </h3>
   <input style="width: 33px; margin-left: 2px; " type="text" id="number1" name="number1">
   <input style="width: 33px; margin-left: 2px;" type="text" id="number2" name="number2">
   <input type="button" onclick="callServlet();" value="Calc">
   <input style="font-family: cursive; border:none" type="text"   id="result" />
   <input style="font-family: cursive; border:none; width: 100%" type="text"  value=""  id="resultText" />

 </body>
 <script>
        function callServlet() {
            var input1 = document.getElementById('number1').value;
            var input2 = document.getElementById('number2').value;
            var myData = {"mydata": {"number1": input1, "number2": input2}};
            $.ajax({
                type: "GET",
                url: "/AjaxServletCalculator",
                data: {jsonData: JSON.stringify(myData)},
                dataType: "json",

                //if received a response from the server
                success: function (data) {
                    //our country code was correct so we have some information to display

                        var json = JSON.parse(data);        
                        alert(json["resultText"]);        
                       /*document.getElementById('number1').value = data.*/        
                }
            });
        }
 </script>

súplicas ayudar a encontrar el problema en el que el programa no funciona

  • Usted obtiene un mensaje de error? Has comprobado en el navegador de red de la consola de lo que el servidor devuelve la petición ajax?
  • Yo no tengo ningún mensaje de error, pero eso es lo que me podría encontrar, tal vez pueda ayudarte a <img src=»goo.gl/6QkHha» ancho=»100″ height=»100″>
  • Sí, eso ayuda. Parece que no has incluido jQuery correctamente. El $ de referencia es desconocido para su navegador.
  • cómo puedo usar ajax método sin carácter $ hasta donde yo sé ajax método empieza con el carácter $
  • $.ajax es la forma corta para jQuery.ajax necesita agregar jQuery html. Agregue el código siguiente en el interior de su <head>– o <body>-etiqueta y se debe trabajar: <script src="//cdn.jsdelivr.net/jquery/2.1.1/jquery.min.js"></script>
  • He añadido <script language=»JavaScript» type=»text/javascript» src=»/js/jquery-1.2.6.min.js»></script> <script src=»//cdn.jsdelivr.net/jquery/2.1.1/jquery.min.js»></script> pero no ayuda tengo un error que apunta a una línea de JSON.analizar Uncaught SyntaxError: testigo Inesperado o (índice):16$.ajax.éxito (índice):16success con jquery 1.2.6.min.js:29jQuery.extender.ajax.onreadystatechange con jquery 1.2.6.min.js:28

InformationsquelleAutor Partizanin | 2014-12-03

2 Kommentare

  1. 1

    Sí, eso es correcto JSON.parse(data) resultó en un error.

    Ajustar también la secuencia de comandos en un document.ready función $(function(){ ... }); para asegurarse de que el DOM esté listo antes de acceder a él.

    El resto de tu código de trabajo. Yo sólo comento los parámetros para el servidor debido a que no tengo backend que puede manejar.

    La jsFiddle a la demo a continuación se aquí.

    JS:

    $(function () {
        function callServlet() {
            var input1 = $("#number1").val(); //document.getElementById('number1').value;
            var input2 = $("#number2").val(); //document.getElementById('number2').value;
            var myData = {
                "mydata": {
                    "number1": input1,
                    "number2": input2
                }
            };
            //console.log(myData);
            $.ajax({
                type: "GET",
                url: 'http://www.mocky.io/v2/547f86501713955b0a8ed4da',  //"/AjaxServletCalculator",
                data: {
                    //jsonData: JSON.stringify(myData) //this works but mocky.io doesn't support it
                },
                dataType: "json",
    
                //if received a response from the server
                success: function (json) {
                    //our country code was correct so we have some information to display
                    console.log(json);
                    //var json = JSON.parse(data);
                    alert(json.data);
                    /*document.getElementById('number1').value = data.*/
                }
            });
        }
        
        $('#calcBtn').click(function() {
            callServlet();
        });
    });

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <h3>Please enter a number to Square : </h3>
    
    <input style="width: 33px; margin-left: 2px; " type="text" id="number1" name="number1">
    <input style="width: 33px; margin-left: 2px;" type="text" id="number2" name="number2">
    <input type="button" id="calcBtn" value="Calc">
    <input style="font-family: cursive; border:none" type="text" id="result" />
    <input style="font-family: cursive; border:none; width: 100%" type="text" value="" id="resultText" />

    • alert(json.data); debe ser alert(json.resultText); como en servlet` obj.put(«resultados»,d); obj.put(«resultText»,»foo»); ` no hay nada como data
    • Sí, lo siento, se me olvidó mencionar que. json.data es sólo para burlarse de mi. json.resultText es el adecuado, si el servidor devuelve.
    • Hice todo como se describe, pero tiene algunos errores, que es una captura de pantalla dropbox.com/s/woczbtengkpdgmv/001.jpg?dl=0
    • Quite la línea de 49 a partir de su código y cambiar la línea de 50 a alert(json.resultText);. Si que resulta en un error también podría hacer console.log(json); para ver qué teclas están disponibles en su respuesta del servidor.
    • Gracias, lo he comprendido todo funciona, el problema era que esta cadena json var = JSON.parse(data);
  2. 1
     <script>
     function callServlet() {
    var input1 = document.getElementById('number1').value;
    var input2 = document.getElementById('number2').value;
    var myData = {"mydata": {"number1": input1, "number2": input2}};
    $.ajax({
        type: "GET",
        url: "/AjaxServletCalculator",
        data: {jsonData: JSON.stringify(myData)},
        dataType: "json",
    
        //if received a response from the server
        success: function (data) {
            //our country code was correct so we have some information to display
    
              // var json = JSON.parse(data);        
                alert(data.resultText);        
               /*document.getElementById('number1').value = data.*/        
          }
      });
     }
    </script>

    trato por encima de

    quitar
    var json = JSON.parse(data);

    • Realmente el problema era que ahora todo está funcionando muy agradecido por la ayuda!

Kommentieren Sie den Artikel

Bitte geben Sie Ihren Kommentar ein!
Bitte geben Sie hier Ihren Namen ein

Pruebas en línea