He estado tratando de aprender AJAX y Javascript básico siguiendo varios tutoriales y ejemplos en línea, pero me he topado con una pared. Estoy tratando de escribir un script simple para tomar la entrada del usuario de un formulario usando AJAX y enviarlo a un script PHP, que luego solo repite la entrada.
Todo lo que realmente puedo decir es que lo que se está ingresando no está pasando, pero todavía no estoy en el punto donde puedo decir por qué. Lo probé con POST y GET, y con varios tipos de datos, con el mismo resultado. Estoy seguro de que estoy haciendo algo mal o estoy malinterpretando algo, pero no estoy seguro de qué.
HTML/ AJAX
<form id="my_form"> word <input type ="text" id="word1"/><br/> <input type="submit"> </form> <script> $(document).ready(function(){ $("#my_form").on(function(e){ e.preventDefault(); var verb = $("word1").val(); $.ajax({ url: "testrun.php", data: "verb", type: "POST", }); }); }); </script>PHP
if (isset($_POST['verb'])){ $x= $_POST['verb']; echo $x; }else { echo "not working"; }EDITAR: he probado algunas de las sugerencias hasta ahora, copiándolas y pegándolas directamente, y ninguna de ellas ha hecho nada que yo pueda ver. Creo que estoy empezando a entender un poco más acerca de cómo debería funcionar AJAX, según las respuestas, pero todavía no llega a PHP por alguna razón. Probé ambos con AJAX/HTML en un archivo separado que llama al script testrun.php y poniendo todo en el archivo testrun.php y básicamente haciendo que se llame a sí mismo con AJAX, pero ninguno de los enfoques ha logrado nada.
Si el AJAX que obtuve de las respuestas está bien, ¿estoy malinterpretando algo sobre cómo se debe configurar PHP para recibir los datos POST? Todavía estoy bastante perdido.
Tres cambios:-
1. var verb = $ ("word1").val(); necesita ser var verb = $ ("#word1").val(); porque su id ( word1 )
2. data: "verb", debe ser data: {"verb":verb},
3. El envío del formulario debe ser correcto, por lo que el código se proporciona a continuación (falta el submit ): -
Código correcto:-
$(document).ready(function(){ $("#my_form").on('submit',function(e){ // check here you have one missing `submit` e.preventDefault(); var verb = $("#word1").val(); // remove space between `$` and `(` $.ajax({ url: "testrun.php", data: {"verb":verb}, type: "POST", }); }); });No puede enviar datos como data: "verb", en ajax. necesita enviar sus datos en params.
En segundo lugar, no puede obtener el valor de entrada de word1 como $("word1").val(); necesita usar # para obtener la entrada por ID.
Ejemplo:
$(document).ready(function(){ $( "#my_form" ).submit(function( e ) { //CHANGED using submit event. e.preventDefault(); var verb = $("#word1").val(); //CHANGED $.ajax({ url: "testrun.php", data: "verb="+verb, //CHANGED type: "POST", }); }); });te olvidas de dar el signo # en var verb = $("word1").val();
y use una variable solo como una variable para los data como data: {"your_var_name" : verb}