Populate input with database while using select option in php

Question

I have Select option which has Customer names. I want to fill phone and email fetched from database onto these 2 input fields. I am using javacript to achieve, followed @mr J answer mentioned HERE. I tried to alert(user); I get selected value but nothing else happens.

addlead.php

 <div class="form-group row">
              <label for="inputEmail3" class="col-sm-4 col-form-label">Phone</label>
                <div class="col-sm-10">
                  <input type="text" class="form-control form-control-sm" id="phone" name="phone" placeholder="Enter Phone no.">
                </div>
            </div>

<div class="form-group row">
             <label for="inputEmail3" class="col-sm-4 col-form-label">Email</label>
                <div class="col-sm-10">
                  <input type="email" class="form-control form-control-sm" id="email" name="email" placeholder="Enter Email" onkeyup="checkemail();" required="">
                </div>
            </div>
<script type="text/javascript">
$(document).ready(function(){
$('#customer_name').on('change',function(){
    var user = $(this).val();
    alert(user);
    $.ajax({
        url : "search2.php",
        dataType: 'json',
        type: 'POST',
        async : false,
        data : { user : user},
        success : function(data) {
            userData = json.parse(data);
            $('#phone').val(userData.phone);
            $('#email').val(userData.email);
        }
    }); 
    });
    });
    </script>

search2.php

 $con = mysqli_connect("localhost", "user_crm", "pass", "kaem_crm");
if (mysqli_connect_errno()){
   echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$user = $_REQUEST['user'];    
$sql = mysqli_query($con, "SELECT phone,email FROM customer WHERE Cust_name = '".$user."' ");
$row = mysqli_fetch_array($sql);

json_encode($row);die;

Note that your code is susceptible to SQL injection. Please read stackoverflow.com/questions/332365/… — Arnold Daniels
– Arnold Daniels, Commented Apr 6, 2020 at 11:57
Do you see any errors in the console when you open your browser's developer toolbar? Did you check the network tab in the toolbar to see what your PHP script is returning? Avoid alert as means of debugging, you can get more information and in a cleaner and more usable way if you do a console.log instead. — El_Vanja
– El_Vanja, Commented Apr 6, 2020 at 12:20
Also, drop that async : false, you don't need it, you want async for this case. And you don't need userData = json.parse(data); when you specify dataType: 'json'. — El_Vanja
– El_Vanja, Commented Apr 6, 2020 at 12:27
if I remove userData = json.parse(data); then how would I get value which I am by$('#phone').val(userData.phone); — mark
– mark, Commented Apr 6, 2020 at 12:33
Because dataType: 'json' option that you set in the AJAX request tells it that it will receive JSON as response and then it automatically turns it into an object. — El_Vanja
– El_Vanja, Commented Apr 6, 2020 at 12:38

andychukse · Accepted Answer · 2020-04-06 13:11:27Z

-2

You are not returning the result, try this

<?php
$con = mysqli_connect("localhost", "user_crm", "pass", "kaem_crm");
if (mysqli_connect_errno()){
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$user = $_REQUEST['user'];    
$sql = mysqli_query($con, "SELECT phone,email FROM customer WHERE Cust_name = 
'".mysqli_escape_string($con, $user)."' ");
$row = mysqli_fetch_array($sql);

header('Content-Type: application/json'); //set the content type for browser
echo json_encode($row); //return result to browser
mysqli_close($con); //close mysql connection

On the form page

  <div class="form-group row">
          <label for="inputEmail3" class="col-sm-4 col-form-label">Name</label>
            <div class="col-sm-10">
              <select class="form-control form-control-sm" id="customer_name" name="name" placeholder="Select Name.">
             <option value="some value">some value</option>
           </select>
            </div>
        </div>
  <div class="form-group row">
  <label for="inputEmail3" class="col-sm-4 col-form-label">Phone</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-sm" id="phone" name="phone" placeholder="Enter Phone no.">
            </div>
        </div>

<div class="form-group row">
         <label for="inputEmail3" class="col-sm-4 col-form-label">Email</label>
            <div class="col-sm-10">
              <input type="email" class="form-control form-control-sm" id="email" name="email" placeholder="Enter Email" onkeyup="checkemail();" required="">
            </div>
        </div>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
 $('#customer_name').on('change',function(){
 var user = $(this).val();
 $.ajax({
    url : "search2.php",
    dataType: 'json',
    type: 'POST',
    async : true,
    data : { user : user},
    success : function(data) {    
        $('#phone').val(data.phone);
        $('#email').val(data.email);
    }
}); 
});
});
</script>

edited Apr 6, 2020 at 13:11

answered Apr 6, 2020 at 12:22

andychukse

1,11614 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

El_Vanja Over a year ago

Copying a bunch of unchanged code obscures the change you made. I'd suggest you remove all the code before return to make your change clearer.

El_Vanja Over a year ago

You don't need that header, the AJAX is already expecting JSON because dataType: 'json' is set.

andychukse Over a year ago

@mark Did you check if the query is returning any results? Also is the search2.php file on same level with your addlead.php file?

mark Over a year ago

yes both files are same level. How do I check if query return any result. Table has the values

El_Vanja Over a year ago

@mark Here's a thorough tutorial on debugging db related problems.

|

Collectives™ on Stack Overflow

Populate input with database while using select option in php

1 Answer 1

10 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

10 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related