Hola, estoy tratando de actualizar los valores en DB usando la etiqueta de entrada .ajax. Sin embargo, cuando escribo algunos valores nuevos en el cuadro de texto de entrada, no reconoce el nuevo valor de entrada. Todavía permanece como el valor predeterminado. Así que traté de ver qué pasaba mostrando el valor en la consola web, y también me mostró el valor predeterminado.
¿Esto se debe a que establecí el valor de las etiquetas de entrada como value="${nickname}" ?
aqui estan algunos de mis codigos
enter code here <label for="user_name" class="col-sm-2 col-form-label">nickname</label> <div class="col-sm-10"> <input type="text" class="form-control" value="${nickname}" id="nickname" name="nickname" required><br> </div> const usernickname= document.getElementById('nickname').getAttribute("value"); $.ajax({ url : '/nicknameok', type : 'post', data : { "nickname" : usernickname, }, });Prueba esto:
<label for="user_name" class="col-sm-2 col-form-label">nickname</label> <div class="col-sm-10"> <input type="text" class="form-control" value="" id="nickname" name="nickname" required><br> <input type="button" value="Submit" id="submit" /> </div> <script> var element = document.getElementById('nickname'); element.value = "Set Initial Value Here"; document.querySelector("#submit").onclick = function () { var usernickname = element.value; alert(usernickname); // handle ajax here } </script><!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <input type="text" name="" id="getValue" onchange="sendData()"> <script> function sendData(){ const usernickname= document.getElementById('getValue').value; $.ajax({ url: "index.php", type: "POST", data: {usernickname :usernickname }, cache: false, }).success: function(result){ alert("data Saved Successfully"); }); } </script> </body> </html>en el archivo index.php obtenga los datos de publicación para que pueda insertar db fácilmente. Espero que este código te funcione. Gracias...
La solicitud ajax se envía antes de que el usuario cambie el valor en el campo de input , una solución es agregar un button y debe hacer una llamada ajax una vez que se hace clic en el botón ( onclick ). Para que el usuario pueda cambiar el valor en el campo de entrada y hacer clic en el botón
<html> <body> <input type="text"> <button onclick="changeNickName()">Change name</button> </body> <script> function changeNickName() { const nickname = document.querySelector("input").value; $.ajax({ url: "url", method: "POST", data: { nickname: nickname } }) } </script> </html>