fetch data from database using ajax codeigniter

Question

In this code after clicking on button it should fetch the data from database and display it dynamically within appropriate div using jquery and ajax but i am not getting any output, below is my code:

controller

defined('BASEPATH') OR exit('No direct script access allowed');

class Afcks extends CI_Controller 
{
public function __construct()
{
    parent::__construct();
    $this->load->model('afcks_search','am');        
}
function index()
{
    $this->load->view('afcks_home');
}
function search_course()
 {
        $result=$this->am->search_course();
        echo json_encode($result);
 }
}

model

 class Afcks_search extends CI_Model
 {
    function search_course()
    {
        $query=$this->db->query("SELECT course_name FROM courses");
        return $query->result();
     }
}

view

 <head>
  <script>
 $(document).ready(function(){
        $("button").click(function(){

            $.ajax({
                url:"<?php echo base_url(); ?>/afcks/search_course";
                type:"POST",
                dataType:"json",
                data:req,
                success:
                function(data)
                {
                    var str='';'
                    str+='<ul>';
                    for(var i = 0; i< data.length; i++)
                    {
                        str+='<li>'+data.course+'</li>';
                    });
                    str+='</ul>';
                    $('#course').html(str);
                }
            });
        });
    });
    </script>  
 </head>
 <body> 
<button> click me </button>
<div id="course"> </div>
</body>

Hey, a) Do you have CSRF enabled? b) Are there any errors in the error console? c) When viewing the developer console, can you see the request and it's response? — Gavin
– Gavin, Commented Jun 28, 2017 at 9:31
@ArchanaGupta - If you go to the URL manually via the browser, do you see anything? i.e. http://localhost/afcks/search_course — Gavin
– Gavin, Commented Jun 28, 2017 at 15:55

B. Desai · Accepted Answer · 2017-06-28 09:34:38Z

1

You are requesting wrong url from ajax. In your controller method name is search_course So change you ajax url to:

url:"<?php echo base_url(); ?>/afcks/search_course";

Also change obj to data as you are retrieving result into data

for(var i = 0; i< data.length; i++)
{
      str+='<li>'+data.course_name+'</li>'; //<----change here
 });

answered Jun 28, 2017 at 9:34

B. Desai

16.4k5 gold badges28 silver badges48 bronze badges

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

1 Comment

Archana Gupta Over a year ago

i did all the changes but still not getting any output.

Akshay Kapoor · Accepted Answer · 2017-06-28 16:27:00Z

0

Change

url:"<?php echo base_url(); ?>/afcks/course";

to

url:"<?php echo base_url(); ?>afcks/search_course";

and

var str='';'
str+='<ul>';

to

var str='<ul>';

And

for(var i = 0; i< data.length; i++)
{
    str+='<li>'+data.course+'</li>';
});

to

$.each(data,function()
{
    str+='<li>'+this.course_name+'</li>';
}

And remove

data:req,

edited Jun 28, 2017 at 16:27

answered Jun 28, 2017 at 13:44

Akshay Kapoor

3022 silver badges8 bronze badges

3 Comments

Akshay Kapoor Over a year ago

also change $result=$this->am->search_course(); to $result=$this->afcks_search ->search_course();

Archana Gupta Over a year ago

still nothing happened

Akshay Kapoor Over a year ago

send your directory to [email protected]

Pratik Thube · Accepted Answer · 2017-06-29 08:44:04Z

0

please copy my code, also try to change base url and json data conversion

<head>
  <script>
 $(document).ready(function(){
        $("button").click(function(){
                 var base=<?php echo base_url(); ?>;
            $.ajax({

                url:base+"/afcks/search_course";//also try "<?php echo base_url(); ?>/afcks/search_course" i dont think it's correct.
                type:"POST",
                dataType:"json",
                data:req,
                success:
                function(data)
                {
                   var responseData = $.parseJSON(data);//convert string to json, i know you datatype is set to 'json' still want to cross check. 
                    var str='';
                    str+='<ul>';
                    $(function() {
                        $.each(responseData, function(i, item) {
                             str+='<li>'+item.course_name+'</li>';
                        });
                    })
                    str+='</ul>';
                    $('#course').html(str);
                }
            });
        });
    });
    </script>  
 </head>
 <body> 
<button> click me </button>
<div id="course"> </div>
</body>

hope this will work !

edited Jun 29, 2017 at 8:44

answered Jun 28, 2017 at 10:37

Pratik Thube

1442 silver badges9 bronze badges

1 Comment

Pratik Thube Over a year ago

sorry for bothering you multiple times, let me try one more time

Collectives™ on Stack Overflow

fetch data from database using ajax codeigniter

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related