Json return-Arrayanzeige in jquery in HTML-Tabelle

Question

in CodeIgniter Controller return json in unten Formiat,

{"r":[{"galleryid":"1","gname":"birthday","eventdate":"2016-07-20 00:00:00","totalphoto":"250","selectedphoto" :"100","glock":"0","userid":"1"},{"galleryid":"2","gname":"anniversary","eventdate":"2016-07-14 00:00:00","totalphoto":"500","selectedphoto":"251","glock":"0","userid":"1"}]} 

und zurück von der Steuerung als Code:

 $this->load->model('gallery_model'); 
    $data['r'] = $this->gallery_model->gallery_data($userid); 
    echo json_encode($data); 

aber nur angezeigt wird in Aussicht: undefined

Ansicht Code:

<script type="text/javascript"> 

// Ajax post 
$(document).ready(function() { 
    $("input#displaygallery").on('click', function (event) { 
     //var user_id = document.getElementById("userdropdown").value; 
     //alert(user_id); 

     event.preventDefault(); 
     var user_id = document.getElementById("userdropdown").value; 
     jQuery.ajax({ 
      type: "POST", 
      url: "<?php echo base_url(); ?>" + "admin_cont/gallery_controller/user_userdata", 
      dataType: 'json', 
      data: {userid: user_id}, 
      success: function (res) { 
       //console.log(res); 

       $.each(res, function (idx, obj) { 
        alert(obj.tagName); 
       }); 
      } 
     }); 
    }); 
}); 

</script> 

Answer 1

Versuchen:

javascript:

$("input#displaygallery").on('click', function (event) { 
    event.preventDefault(); 
    var user_id = document.getElementById("userdropdown").value; 
    jQuery.ajax({ 
     type: "POST", 
     url: "<?php echo base_url(); ?>" + "admin_cont/gallery_controller/user_userdata", 
     dataType: 'json', 
     data: {userid: user_id}, 
     success: function (res) { 
      var html = "<table>"; 
      html += "<thead>"; 

      html += "<tr>"; 
      html += "<th>eventdate</th>"; 
      html += "<th>galleryid</th>"; 
      html += "<th>glock</th>"; 
      html += "<th>gname</th>"; 
      html += "<th>selectedphoto</th>"; 
      html += "<th>totalphoto</th>"; 
      html += "<th>userid</th>"; 
      html += "<tr>"; 

      html += "<thead>"; 
      html += "<tbody>"; 
      for (i = 0; i <= res.r.length - 1; i++) { 
       html += "<tr>"; 
       html += "<td>" + res.r[i].eventdate + "</td>"; 
       html += "<td>" + res.r[i].galleryid + "</td>"; 
       html += "<td>" + res.r[i].glock + "</td>"; 
       html += "<td>" + res.r[i].gname + "</td>"; 
       html += "<td>" + res.r[i].selectedphoto + "</td>"; 
       html += "<td>" + res.r[i].totalphoto + "</td>"; 
       html += "<td>" + res.r[i].userid + "</td>"; 
       html += "<tr>"; 
      } 
      html += "</tbody>"; 
      html += "</table>"; 
      $("your cointainer id or class name").html(html); 
     } 
    }); 
});