I am trying to fill a input
according to a data that I choose from a select
, I do it by means of AJAX
and PHP
. This is my code:
<select id="pro" name="plan" class="form-control">
<option readonly>Elegir Plan</option>
<?php
$result = $obj->ListaPlanes();
foreach($result as $values){ ?>
<option value="<?php echo $values['id_plan']?>">
<?php echo $values['planes'] ?>
</option>
<?php } ?>
</select>
<input class="form-control" type="text" id="price" value="" readonly>
AJAX
$(document).on('ready',function(){
$('#pro').on('change',function(){
var id = $("#pro").val()
$.ajax({
type: 'POST',
url:'ver_price.php',
data:{'id':id}
})
.done(function(listas_cur){
$("#price").val(listas_cur)
})
.fail(function(){
alert('error')
})
});
});
PHP
<?php
function ver_precio(){
$con = new PDO('mysql:host=localhost;dbname=vmenu.us;charset=utf8','root','');
$id = $_POST['id'];
$query = $con->prepare("SELECT * FROM plans WHERE id_plan ='$id'");
$query->execute();
$row = $query->fetch();
$list = $row['price'];
return $list;
}
echo ver_precio();
?>
Those are my 3 files. The result I get is absolutely nothing. It doesn't show me anything in the input
, nor does it give me any errors in the console, I don't get anything.
You are wrongly assigning the listeners to the events, both in the
ready
and for thechange
The documentation for on(event,element,function()) clearly explains to us that the first parameter is the event and the second is the element you want to listen to (the latter is missing in your code) . then it should be.
And the
ready
coulddocument
be.Complete