How to split data while loop data in php and pass to ajax html with different id's

Question

I have db table of doctors nearly more than 100 doctors list in it, Here is my PHP code for doctors dc.php :

    $conn= mysqli_connect('localhost', 'root', '', 'test');
    $query = mysqli_query($conn, "select * from doctors");
    while($result=mysqli_fetch_array($query)){
    $dc_name = $result['name'];
    $dc_img = $result['image'];
    $dc_email = $result['email'];


    echo $dc_name."||".$dc_img."||".$dc_email;
    }

    I want echo all doctors another main page index which already fixed large layout with bootstrap,html,css by using ajax calling on click

    Here is my code for ajax

    $(function(){
    $(".divscrolla").on("click", function(){
    $.ajax({
     url:'db.php',
    type:'POST',
    data:{"data":$(this).val()},
    success:function(data){
    var splitted = data.split("||");
    $("#result_name").html.splitted[0];
    $("#result_img").html.splitted[1];
    $("#result_email").html.splitted[2];
    }
    });
    });

Here I want display all 100 records by AJAX

But here I am getting only first element only, but I have more 100 records in database.

How can I solve by simplifying this?

Answer 1

Did you try

$resultArray = $result->fetch_all(MYSQLI_ASSOC);
$jsonstring = json_encode($resultArray);
echo $jsonstring;

And then in the AJAX code don't split, let the json format help you. By setting the data type to json dataType: "json",

$(function(){
    $(".divscrolla").on("click", function(){
        $.ajax({
            dataType : "json",
            url:'db.php',
            type:'POST',
            data:{"data":$(this).val()},
            success:function(data){
                //consume the data in a assoc array manner
                //data[0]['name'] for first entry's name
            }
        });
    });
 }