Get a single row from the database using AJAX in CodeIgniter?

Question

I wonder how to get data from database using AJAX in CodeIgniter. Could you please check the code below to find out the reason of problem? Nothing happens when I click on the link from my view.

Here is my view:

<a href="#" class="faq_title"><?php echo $faq_title; ?></a>

Here is my controller:

public function get_faq_data() {
    $this->load->model("model_faq");
    $title = $_POST['title'];
    $data["results"] = $this->model_faq->did_get_faq_data($title);
    echo json_encode($data["results"]);
}

Here is my model:

public function did_get_faq_data($title) {
    $this->db->select('*');
    $this->db->from('faq');   
    $this->db->where('faq_title', $title); 

    $query = $this->db->get('faq');

    if ($query->num_rows() > 0) {
        return $query->result();
    } else {
        return false;
    }
}

Here is my JavaScript file:

$(".faq_title").click(function() {
    var title = $(this).text();

    $.ajax({
        url: 'faq/get_faq_data',
        data: ({ title: title }),
        dataType: 'json', 
        type: 'post',
        success: function(data) {
            response = jQuery.parseJSON(data);
            console.log(response);
        }             
    });
});

Look into `json_encode()` if you want your AJAX call to easily parse and use the data. Check **[this](http://stackoverflow.com/questions/20150130/ajax-and-php-to-enter-multiple-forms-input-to-database/20150474#20150474)** out for more ideas — MonkeyZeus, May 28 '14 at 12:24
I'd also suggest using a json view and return rather thant 'echo' in your controller. I think CI passes some headers which may cause issues with json. — David, May 28 '14 at 12:25
@David a JSON view is definitely the proper way to do this especially if you set `compression = true` in the config otherwise your app will bomb-out. I have personally never seen a headers issue when simply echoing it especially if you tell the AJAX call to expect a JSON return string but then again, never say never =) — MonkeyZeus, May 28 '14 at 12:28

Jai · Accepted Answer · 2014-05-28T12:28:46.487

3

Try this:

$(function(){ // start of doc ready.
   $(".faq_title").click(function(e){
      e.preventDefault();  // stops the jump when an anchor clicked.
      var title = $(this).text(); // anchors do have text not values.

      $.ajax({
        url: 'faq/get_faq_data',
        data: {'title': title}, // change this to send js object
        type: "post",
        success: function(data){
           //document.write(data); just do not use document.write
           console.log(data);
        }
      });
   });
}); // end of doc ready

The issue as i see is this var title = $(this).val(); as your selector $(".faq_title") is an anchor and anchors have text not values. So i suggested you to use .text() instead of .val().

edited May 28 '14 at 12:28

answered May 28 '14 at 12:22

Jai

74,255
12
74
103

thank you for your answer. I have just edited my code but still nothing happens while clicking on the link. Could you check my code once more? – NiceTry May 28 '14 at 12:27
ok thank you, now I should learn how to pass js object instead of variable – NiceTry May 28 '14 at 12:42
Could you check now please? – NiceTry May 28 '14 at 13:11

score 0 · Answer 2 · answered Nov 25 '21 at 13:28

The way I see it, you aren't using the anchor tag for its intended purpose, so perhaps just use a <p> tag or something. Ideally, you should use an id integer instead of a title to identify a row in your database.

View:

<p class="faq_title"><?php echo $faq_title; ?></p>

If you had an id integer, you could use a $_GET request an receive the id as the lone parameter of the get_faq_data() method.

Controller:

public function faqByTitle(): void
{
    if (!$this->input->is_ajax_request()) {
        show_404();
    }
    $title = $this->input->post('title');
    if ($title === null) {
        show_404();
    }
    $this->load->model('model_faq', 'FAQModel');
    echo json_encode($this->FAQModel->getOne($title));
}

FAQ Model:

public function getOne(string $title): ?object
{
    return $this->db->get_where('faq', ['faq_title' => $title])->row(); 
}

JavaScript:

$(".faq_title").click(function() {
    let title = $(this).text();

    $.ajax({
        url: 'faq/faqByTitle',
        data: {title:title},
        dataType: 'json', 
        type: 'post',
        success: function(response) {
           console.log(response);
        }             
    });
});

None of these snippets have been tested.

Get a single row from the database using AJAX in CodeIgniter?

2 Answers2

Linked