document.write('
Data hosted with ♥ by Pastebin.com - Download Raw - See Original
  1. <%@page contentType="text/html" pageEncoding="UTF-8"%>
  2. <!DOCTYPE html>
  3. <html>
  4.     <head>
  5.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  6.         <title>JSP Page</title>
  7.         <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  8.         <script >
  9.  
  10.             var webresource = "<%= getServletContext().getContextPath()%>/webresources";
  11.             var calculadoraRest = webresource + "/calculadora";
  12.             var factorialPath = calculadoraRest + "/factorial";
  13.             function getAuthPairs() {
  14.                 return {user: $("#usuario").val(), password: $("#contrasenia").val()};
  15.             }
  16.             function init() {
  17.                 $("#factorialBtn").click(function() { //definiendo el evento click del boton #factorialBtn
  18.                     var auth = getAuthPairs();
  19.                     var vBase = $("#f_base").val(); //obteniendo el valor del input #f_base
  20.                     $.ajax(factorialPath,
  21.                             {   data: {base: vBase},
  22.                                 username:auth.user,
  23.                                 password:auth.password,
  24.                                 success: function(resp) { //llamando al webservice con el parametro base igual a la variable base
  25.                                     $("#f_resultado").text("Resultado:" + resp); //... muestra el resultado obtenido en resp en el div
  26.                                 }
  27.                             });
  28.                 });
  29.             }
  30.         </script>
  31.     </head>
  32.     <body>
  33.         <h1>Calculadora</h1>
  34.  
  35.         <form>
  36.             <fieldset>
  37.                 <legend>Inicio de sesión</legend>
  38.                 <label for="usuario">Usuario</label><input type="text" name="usuario" id="usuario"/><br/>
  39.                 <label for="contrasenia">Contraseña</label><input type="password" name="contrasenia" id="contrasenia"/><br/>
  40.  
  41.             </fieldset>
  42.         </form>
  43.         <form>
  44.             <fieldset>
  45.                 <legend>Factorial</legend>
  46.                 <label for="f_base">Base</label><input id="f_base" name="base"  /><br/>
  47.                 <button id="factorialBtn" type="button">Calcular factorial</button>
  48.                 <div id="f_resultado"></div>
  49.             </fieldset>
  50.         </form>
  51.  
  52.  
  53.     </body>
  54.     <script type="text/javascript">
  55.         $(document).ready(init)
  56.     </script>
  57. </html>
');