How to access the value of $.each outside the loop in ajax success?

Question

Hi guys i am trying to use value of $.each outside the loop but whenever i save the 'id' it shows me the same data again so how can i access that value outside the loop. let me show you my code.

Now when i try to access the value of $post_id in like function it shows me the same id again for a certain loop. like if i got the id as 464 then for all the post_id it will be 464 but when i append the id it shows me the original id again

what can i do to access the value of id in like function ?

    function loadmore(){
          var lastID = $('.load-more').attr('lastID');
         //alert(lastID);
         
              jQuery.ajax({
                  type:'POST',

                  url:'<?php echo base_url("user/get_all_post"); ?>',
                   data: {id:  lastID },
                      dataType: 'json', 
                
                
                  beforeSend:function(data){
                      $('.load-more').show();
                  },
                  success:function(data){

                         var ParsedObject = JSON.stringify(data);            
                         var json = $.parseJSON(ParsedObject);
                          
                         
                         if (json=="") {
                          $("#bottom").append('<div class="btn btn-default col-md-6" >'+'No More Results'+'</div>');
                          $("#Load_more_data").hide()
                        
                         }else{
                           $postID=json[json.length-1].id;
                            
              $('.load-more').attr('lastID', $postID);

                $.each(json, function (key, data) {
   $post_id=data.id;
 
   var post_id=data.id;
   $('.post_id_value').attr('post_id', $post_id);
    var post_status=data.status;
     var status_image=data.status_image;
    var multimage=data.multimage;
  

                             if(!post_status=="" && !status_image==""){
                               $("#status_data").append('<input type="text" value="'+ post_id+'" class="post_id_value"> <div class="col-md-6 postdata"><a ><?php echo img($user_image); ?></a><a class="weshare_user_name text-font"><?php echo $uname; echo " "; echo $lname;?></a><div class="weshare_user_status">'+post_status+'</div><div class="weshare_user_singleimage"><img style="height:300px; width:400px;" src="<?php echo base_url('uploads'); ?>/'+status_image+'"></div><div class="row"><div class="col-md-12"><ul class="list-inline"><li><a href="#"><span class="glyphicon glyphicon-thumbs-up"></span> Like</a></li><li><a  onclick="like(this);"><span class="glyphicon glyphicon-comment"></span> Comment</a></li><li><a href="#"><span class="glyphicon glyphicon-share-alt"></span> Share</a></li></ul></div></div></div>');
                             }else{

                             }

                              if(!post_status=="" && status_image==""){
                               $("#status_data").append('<input type="text" value="'+ post_id+'" class="post_id_value"><div class="col-md-6 postdata" ><a ><?php echo img($user_image); ?></a><a class="weshare_user_name text-font"><?php echo $uname; echo " "; echo $lname;?></a><div class="weshare_user_status">'+post_status+'</div><div class="row"><div class="col-md-12"><ul class="list-inline"><li><a  onclick="like(this);"><span class="glyphicon glyphicon-thumbs-up"></span> Like</a></li><li><a ><span class="glyphicon glyphicon-comment"></span> Comment</a></li><li><a href="#"><span class="glyphicon glyphicon-share-alt"></span> Share</a></li></ul></div></div></div>');
                             }else{

                             }

                             
                             if (multimage=="") {

                             }
                              else{
                               $("#status_data").append('<input type="text" value="'+ post_id+'" class="post_id_value"><div class="col-md-6 postdata" ><a ><?php echo img($user_image); ?></a><a class="weshare_user_name text-font"><?php echo $uname; echo " "; echo $lname; ?></a><div class="weshare_user_multimage"><img style="height:300px; width:400px;" src="<?php echo base_url('uploads'); ?>/'+multimage+'"></div><div class="row"><div class="col-md-12"><ul class="list-inline"><li><a  onclick="like(this);"><span class="glyphicon glyphicon-thumbs-up"></span> Like</a></li><li><a href="#"><span class="glyphicon glyphicon-comment"></span> Comment</a></li><li><a ><span class="glyphicon glyphicon-share-alt"></span> Share</a></li></ul></div></div></div>');
                              }                              

                    });
                  }
              }
            });
          }

function like() {
  var Post_id = $('.post_id_value').attr('value');
  var User_id = $('.id_data').attr('value');
  alert(Post_id);
  jQuery.ajax({
    type: 'POST',
    url: '<?php echo base_url("user/post_likes"); ?>',
    data: {
      Post_id: Post_id,
      User_id: User_id
    },
    dataType: 'json',
    success: function(data) {
      console.log(data);
      alert();
    }
  });
}

here is the html part

<div class="col-md-6 postdata">
  <a><img src="http://localhost/P_Display/uploads/camera-581126_1920.jpg" class="weshare_user_image" alt="" width="50px" height="50px"></a><a class="weshare_user_name text-font">Ashish Vyas</a>
  <div class="weshare_user_status">hi</div>
  <div class="row">
    <div class="col-md-12">
      <ul class="list-inline">
        <li><a onclick="like();"><span class="glyphicon glyphicon-thumbs-up"></span> Like</a></li>
        <li><a><span class="glyphicon glyphicon-comment"></span> Comment</a></li>
        <li><a href="#"><span class="glyphicon glyphicon-share-alt"></span> Share</a></li>
      </ul>
    </div>
  </div>
</div>

here is the like button and whenever i click on it runs the ajax function like();

what is the use of the like function?, how does your json object look like? — madalinivascu, Mar 06 '17 at 05:24
i created a like button then i call the event onclick=like(); when like function calls it takes the post id as well as the user to the databse and shows which user has liked my which post also when someone like my post. that is the use of like function. @madalinivascu — Himanshu Goyal, Mar 06 '17 at 05:27
Pass callback to `loadmore` and on success call this `callback` with response — Rajesh, Mar 06 '17 at 05:27
@HimanshuGoyal can you post your markup _(generated one)_. so that, it can be answered easily. — Jai, Mar 06 '17 at 05:29
Possible duplicate of [How do I return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Rajesh, Mar 06 '17 at 05:29
what do you want me to show you @Jai ? the html code generated? — Himanshu Goyal, Mar 06 '17 at 05:35
Okay will do just one more question in each post do you have a post id hidden input. — Jai, Mar 06 '17 at 05:42
yes whenever a post is done it shows a hidden input post_id @Jai — Himanshu Goyal, Mar 06 '17 at 05:45

score 0 · Answer 1 · answered Mar 06 '17 at 05:50

To me is seems that you are accessing a value with a class selector. which would give you the last element's value each time. Instead just pass the context in the function as:

onclick="like(this)"

Now in the function change to this:

function like(el) {
  var Post_id = $(el).closest('div').find('.post_id_value').attr('value');
  var User_id = $(el).closest('div').find('.id_data').attr('value');

Other than the above i want to mentions some pointers in your code:

In the loadmore() as you have dataType: 'json', so you don't need to parse the response.
Doing this below is just not needed as this is automatically done by dataType:"json".

var ParsedObject = JSON.stringify(data);
var json = $.parseJSON(ParsedObject);

sorry its showing me undefined when i try to get the value of $Post_id in like function @Jai — Himanshu Goyal, Mar 06 '17 at 07:27

How to access the value of $.each outside the loop in ajax success?

1 Answers1