Problem filling in input with data from a select

Question

Problem filling in input with data from a select

Navigation

#1 by (1 votes)

2

I am trying to fill a input according to a data that I choose from a select , I do it using 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 does not show me anything in input , nor does it give me any errors in console, I do not get anything.

javascript jquery php ajax

asked by Alejo Mendoza 16.02.2018 в 20:05

source

1 answer

How to avoid showing error when using the $ _REQUEST method in php? How to read data input from keyboard with NodeJS?

score 1 · Accepted Answer

You are erroneously assigning listeners to events, both in ready as for change

The documentation of on (event, element, function ()) clearly explains that the first parameter is > event and the second is the element to which you want to listen (the latter is missing in your code) . then it should be.

$(document).on('change','#pro',function(){ ...}

And the ready of document could be.

$(function() {

});

Complete

$(function() {
    $(document).on('change','#pro',function(){
         /**codigo ajax*/
     });
});