How can we fetch data from database in PHP using ajax and display in value of input type?

I am working with two forms where if user submitted first form the data is inserted using ajax to database and user is redirected to second form(Both Forms are in same file). When user which is present on second form presses back button the value on the input type text for form1 one to be fetched from db which is stored when user submitted the first form. My doubt is how can we pass value from ajax call to input type text Here is my code which i have done uptill now

//Form 1
<form  id="titlechange">
<div id="step1">
<input type="text" name="tbl_title" id="title" value="" class="form-control">
 <input type="text" name="tbl_description" id="description" value="" class="form-control">    
  <button type="button" onclick="addTitle()" name="firstsubmit" class="update-btn" >Next</button>                                                
</div>
</form>
//Form 2
<form  id="detailsubmit">
<div id="step2">
<div class = "data"> //input type hidden retreived after submitting from 1 inside class data
<input type="hidden"  value="<?php echo $insertData  ?>" class="form-control">
</div>
<input type="text" name="city" id="city" value="" class="form-control">
 <input type="text" name="state" id="state" value="" class="form-control">    
  <button type="button" onclick="addTitle()" name="firstsubmit" class="update-btn" >Next</button>   
<button type="button" onclick="editModeForStep1()" name="firstsubmit" class="update-btn" >Back</button>                                                
</div>
</form>

Ajax Call for back button

   function editModeForStep1()
{
  var formData = new FormData($('#detailsubmit')[0]);
             formData.append('action', 'retreive');
    $.ajax({
                 method: 'post',
                 processData: false,
                 contentType: false,
                 cache: false,
                 enctype: 'multipart/form-data',
                 url: 'ClientData.php',
                         data: formData,
         
                      success:function(msg){
//what should be written here for displaying value received from `ClientData.php` to value attribute of input type text in form 1 
              $('#step1').addClass('in active');
            alert('success');                     
                     
                 }
             });
}

ClientData.php

 if(isset($_POST["action"]) && $_POST["action"]=="retreive"){
   
   $insertData = $_POST['insertdata'];
   $slideOne = $objMaster->getSlideForEdit($insertData);
   foreach($slideOne as $key=>$value)
   {
    echo   $title = $value['title'];
      echo $description = $value['description'];
   }
             
   }

Answer

First, let’s change ClientData.php to return data in a more usable form.

if(isset($_POST["action"]) && $_POST["action"]=="retreive"){

    $insertData = $_POST['insertdata'];

    //select first row of results for getSlideForEdit by adding `[0]`
    $slideOne = $objMaster->getSlideForEdit($insertData)[0];
    
    //notice array keys match form1 form elements ID
    //notice there is no need for a loop here
    echo json_encode(
        array(
            'title' => $slideOne['title'], 
            'description' => $slideOne['description']
        )
    );

    //if you want to update EVERYTHING from $slideOne, you can just do
    //echo json_encode($slideOne);
    //instead of the above json_encode()

}

Now our return will contain JSON data instead of plain strings. We can update your success method to update those input boxes.

...
data: formData,

//set dataType to json because we are receiving json from the server
dataType: 'json',
success:function(msg){
    $('#step1').addClass('in active');
    
    //if you don't set dataType to json you can also do
    //msg = JSON.parse(msg);

    //loop through returned array.
    $.each(msg, function(index, value) {
        
        //select element by index e.g `#title`, set value
        $('#' + index).val(value);
    });

    alert('success');                     
}

This solution will dynamically update any input on your page as long as you return a key=>value pair for it from your server.