Call JavaScript functions in HTML

Question

Call JavaScript functions in HTML

Navigation

#1 by (1 votes)

1

I have a JSP file of a shopping cart and to evaluate which servlet to use depending on the button action, with JavaScript I used a method to attach it, but when I click the button nothing happens.

This code is part of the head and has a java code where I evaluate the role of the user through a session:

<head>
<title>Runner Store</title>
<link rel="stylesheet" href="css/<%=css%>">
<%
String js="";
if (session.getAttribute("rol") != null) {
    int rol = (Integer) session.getAttribute("rol");
    if (rol==1){
        js = (String)session.getAttribute("jsuser");
    } else {
        js = (String)session.getAttribute("jsadmin");
    }
}else{
    js = "main.js";
}
%>
<script src="js/<%=js%>"></script>
</head>

Well, the validation does what is expected, give the src the corresponding js, but here the problem, I have a simple function to adhere to the form the action and the method, as well as a hidden input that contains the value of the id of the product that I am going to add to the cart:

<% String funcag = "agregar()"; %>

<input type="button" class="boton" id="sendagbtn" value="Añadir al carrito" onclick="<%=funcag%>">
<input type="hidden" name="sendag" value="<%=a.getId()%>">; //esto es de un for each que me trae datos del producto.

and this is the function of js:

function agregar(){
   var serv = '/RunnerStoreApp/AddCarrito';
   var met = 'POST';
   document.getElementById("sendagbtn").value = "Añadido al carrito";
   document.getElementById("sendagbtn").disabled = true;
   document.forms.formaction = serv;
   document.forms.formmethod = met;
}

And here is where I arrive, that when I click on the button, it does not run.

Note: I'm a novice with JavaScript.

javascript html funciones

asked by Francisco Castle 10.04.2018 в 16:03

source

1 answer

Hello I want to delete certain content from a folder search sql query result in php array

score 1 · Answer 1

Seeing your code I see that you are mixing Javascript and HTML with JSP, your JavaScript code resides within your final page, so the call to your function agregar() from HTML does not need to go through JSP. If this function is inside the HTML document you can call it directly, you do not need to do this: <% String funcag = "agregar()"; %>

I leave you a little snippet on how to call your function with pure JavaScript / HTML and the respective HTTP call that I see you want to do using XML HttpRequest

function agregar() {
  console.log('Función agregar llamada');
  var serv = '/RunnerStoreApp/AddCarrito';
  var met = 'POST';
  
  // Modificamos el botón mientras se realiza la llamada
  document.getElementById("sendagbtn").value = "Añadiendo al carrito";
  document.getElementById("sendagbtn").disabled = true;
  
  //Creamos la llamada HTTP
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      // Acción que quieres ejecutar cuando la llamada fue exitosa
      document.getElementById("sendagbtn").value = "Añadido al carrito";
    }
  };
  
  // Realizamos la llamada HTTP
  xhttp.open(met, serv, true);
  xhttp.send();
}

<input type="button" class="boton" id="sendagbtn" value="Añadir al carrito" onclick="agregar()">
<input type="hidden" name="sendag" value="idObjeto">