Changing data dynamically with Ajax in CodeIgniter

Question

I have such a button, when I click on this button, no of likes will automatically change. Above the button, the number of liked ones is displayed. For this, I used ajax to implement this function.

This is my code in the view:

<p id='state'>
   <i class='fa fa-thumbs-up'></i> <?php echo $countLike;?> likes &bull; 
   <i class='fa fa-thumbs-down'></i> <?php echo $countDisLike;?> dislikes</p>

   <button class='detailButton' name='like_name' id='click_like' value='<?php echo $link;?>' title='Like this post'><i class='fa fa-thumbs-up'></i> Like</button>

Javascript code above view:

<script type="javascript/text">
$(document).ready(function){
  $("#click_like").click(function(event){
    event.preventDefault();
    var id = document.getElementById("click_name").value;
    jQuery.ajax({
      type:"GET",
      url: "<?php echo base_url();?>index.php/photoCheese/like_total/",
      dataType:'json',
      data: {like_id = id},
      success: function(res){
        if(res){
          jQuery("div#state").html(res.no_likes);
        }      
      }
    });
  });
});

My controller:

public function like_total(){
        $id = $this->session->userdata('userID');
        $upload = $_GET['like_id'];
        $data = array('like' => 1,
                        'userID'=>$id,
                        'uploadID'=>$_GET['like_id']);

        $this->photoCheese_model->get_like_total($data,$upload);

        return json_encode($data);
    }

Model:

public function get_like_total($data,$uplaod){
        $success = $this->db->insert('tbl_like',$data);

        if($success){
            $this->db->select('uploadID,SUM(`like`) as no_likes',false);
            $this->db->where('uploadID',$upload);
            $this->db->where('like !=',2);

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


        }
        return $query->result_array();
    }

When I try to run this code, it does not work. I mean, it shows no result. I am new to ajax and this is the first time I have taken advantage of this. Please help me with this. Many thanks.

Answer 1

this is not true in your code. Also refer to jQuery.ajax ()

data: {like_id = id},

This will

data: {like_id:id},

Answer 2

, , : =

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

jQuery.ajax({
      type:"GET",
      url: "<?php echo base_url();?>index.php/photoCheese/like_total/",
      dataType:'json',
      data: {like_id : id},
      success: function(res){

          $("#like").html(res);

      }
    });

HTML ,

<p id='state'>
   <i class='fa fa-thumbs-up'></i> <b id="like"><?php echo $countLike;?></b> likes &bull; 
   <i class='fa fa-thumbs-down'></i> <?php echo $countDisLike;?> dislikes</p>

Answer 3

saty, .

, , :

jQuery("div#state").html(res.no_likes);

#state - p, div, . , . , HTML , . HTML JS:

HTML:

<p id='state'>
    <i class='fa fa-thumbs-up'></i><span id="state_likes"><?php echo $countLike;?></span> likes &bull; 
    <i class='fa fa-thumbs-down'></i> <?php echo $countDisLike;?> dislikes
</p>

<button class='detailButton' name='like_name' id='click_like' value='<?php echo $link;?>' title='Like this post'><i class='fa fa-thumbs-up'></i> Like</button>

JavaScript:

jQuery.ajax({
  type:"GET",
  url: "<?php echo base_url();?>index.php/photoCheese/like_total/",
  dataType:'json',
  data: {like_id: id},
  success: function(res){
    if(res){
      jQuery("#state_likes").html(res.no_likes);
    }      
  }
});

. , .

Answer 4

data: {like_id = id},

data: {like_id : id},

data: "like_id ="+id,

SideNotes

1) . $_GET['like_id']   CI

$upload = $this->input->get('like_id');

2) , $data, result

return json_encode($data);

$result = $this->photoCheese_model->get_like_total($data,$upload);

return json_encode($result);

console.log()

success: function(res){
        console.log(res);
        if(res){
          jQuery("div#state").html(res.no_likes);
        }      
      }

Answer 5

, "" Chrome, "_" , , "", "", , . "" , , BTW event.preventDefault();

, , .

Use this image as a reference to the image upload method.