Fetch Data From Database using AJAX in CodeIgniter

Question

This code is not working in codeigniter when we get json array from database. How can we get data from database using ajax

<script type="text/javascript">
 $(window).on("load",function(){
    $.ajax({
        type:'ajax',
        url:'<?php echo base_url('index.php/user_control/showdata/'); ?>', 
        async:false,
        dataType:'json',
        success:function(data)
        {
//          console.log(data);
            var html='';
            var i; 
            for(i=0;i<data.length;i++)
            {
                html+='<tr>'+
                        '<td>'+data[i].uname+'</td>'+
                        '<td>'+data[i].email+'</td>'+
                        +'</tr>'; 
            }
            $(".showid").html(html); 
        },
        error:function(data)
        {
            alert('ajax error'); 
        }
    });
});

replace type:'ajax', with post or get like type:'post', and show your controller also — Pradeep
– Pradeep, Commented Jul 12, 2018 at 4:55

Shahmarasy · Accepted Answer · 2018-07-12 16:08:04Z

this is all of you need

1.Controller:

class Ajax extends CI_Controller
{
    public function Users($id)
    {
        $this->load->model('User_mdel');
        echo json_encode($this->User_mdel->list());
    }
}

2.Model:

class User_mdel extends CI_Model
{
    public function list()
    {
        return $this->db->get('users')->result();
    }
}

3.View

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">

</head>
<body>

<div class="container">          
  <table class="table table-dark table-striped" id="myTable">
    <thead>
      <tr>
        <th>Firstname</th>
        <th>Lastname</th>
      </tr>
    </thead>
    <tbody>
    </tbody>
  </table>
</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>

<script type="text/javascript">
    $(window).on("load", function () {
        $.get("<?php echo base_url('index.php/ajax/users/'); ?>", function (data) {

            var result = JSON.parse(data);

            $.each(result, function (i, item) {
                $('#myTable tbody').append('<tr><td>' + item.Firstname + '</td><td>' + item.Lastname + '</td></tr>');
            });
        });

    });
</script>
</body>
</html>

and END

This should be picked as the correct answer, thank you Bahman rapsody

Collectives™ on Stack Overflow

Fetch Data From Database using AJAX in CodeIgniter

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related