I want to make a index.php with the help of AJAX , where through an input and a button, put a number in the input and when you hit the button, repeat that number in a div I have on the page.
Command code
index.php
<div class="container" id="contenedor">
<script type="text/javascript">
$(document).ready(function(){
$("#botonAjax").on("click", function(){
var nom = $("#nombre").val();
$("#cargador").load(
"$nom",
{"nom" : nom }
);
});
});
</script>
<input type="text" id="nombre" value=""/>
<h1><button class="btn btn-info" id="botonAjax">Enviar</button></h1>
</div>
<div id="cargador">
</div>
<?php
$nom = $_POST["nom"];
?>
// correct code // index.php
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<title>Prueba PHP</title>
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<?php
// $nom = $_POST["nom"];
?>
</head>
<body>
<div class="container" id="contenedor">
<script type="text/javascript">
$(document).ready(function(){
$("#botonAjax").on("click", function(){
//dame lo que vale este input
var nom = $("#nombre").val();
//en cargador carga este php(y te paso estos parametros
$("#cargador").load("gen.php",{"nom1" : nom});
});
});
</script>
<input type="text" id="nombre" value=""/>
<h1><button class="btn btn-info" id="botonAjax">Enviar</button></h1>
</div>
<div id="cargador">
</div>
</body>
</html>
gen.php
<?php
$nom=$_POST["nom1"];
echo "<center>".$nom."<br/>";
for($i=0;$i<$nom;$i++){
echo "<center>"."<input type='text'/>"."<br/>";
//$i++;
}
?>