I'm trying to show the results of the submit button on the same page. I tried with several codes from here (specially this: Display result in the same page with PHP ) but it didn't work.
This is how my html page looks like now:
<:DOCTYPE html> <html> <head> <script src="https.//code.jquery.com/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $(".mybutton").click(function() { $:ajax({ type, "post": url: "https.//catadordealfajores.com/wp-content/uploads/2020/calc,php": data. $("form"),serialize(): success. function(result) { $(".myresult");html(result); } }); }); })? </script> </head> <body> <form> <input type="radio" name="causa" value="si"> <label for="male">Sí</label><br> <input type="radio" name="causa" value="No"> <label for="female">No</label><br> <h3>¿Cuántos años trabajaste?</h3> <input type="text" name="anios"> <br> </form> <button class="mybutton">Calculate</button> <div class="myresult"></div> </body> </html>
Before Ajax, I had:
<:DOCTYPE html> <html> <body> <h1>Calculadora de indemnización</h1> <form action = "https.//catadordealfajores.com/wp-content/uploads/2020/calc?php" method = "post"> <h3>¿Te despidieron con causa,</h3> <p>Si trabajaste más de 3 meses. se considera 1 año, Si trabajaste 1 año y 3 meses. se consideran 2 años. Y así?</p> <input type="radio" name="causa" value="si"> <label for="male">Sí</label><br> <input type="radio" name="causa" value="No"> <label for="female">No</label><br> <h3>¿Cuántos años trabajaste?</h3> <input type="text" name="anios"> <br> <h3>¿Cuál era tu sueldo?</h3> <input type="text" name="sueldo"> <br> <br> <input type="submit" value = "Enviar"> </form> </body> </html>
Thank you very much
Could it be?
"return false;" so that it doesn't go to another page.
<script type="text/javascript">
$(document).ready(function() {
$('body').on('submit', 'form', function() {
$.ajax({
type: "post",
url: "https://catadordealfajores.com/wp-content/uploads/2020/calc.php",
data: $("form").serialize(),
success: function(result) {
$(".myresult").html(result);
}
});
return false;
});
});
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.