简体   繁体   中英

Unable to pass small image to modal popup and display it

I am creating image elements of load of a page and written the code in AJAX POST jquery method for it. So small icons of image are coming on page. When I click on the image on document.ready(onclick) it must open big in modal pop up but it is not opening.However blank pop up is opening.

loadup.js code

$.ajax({
    type: "POST",
    url: "php/loadimages_f.php",
     dataType : 'json',
    success: function (result) {
        //alert(result);
         if(result==0){
       $("#friends_list_insert").after(" No Friends Yet...");
   }
    else{   
    for(var i = 0; i < result.length; i++)
        {
             var PP_PATH;
            PP_PATH="php/"+result[i].Photo_URL;
          var li_post="<li class='imggalli' style='list-style:none;'><a 
    href='#' data-toggle='modal' data-target='#myModal2' class='thumbnailimg' title='Image"+i+"'><img src='"+PP_PATH+"' style='margin:2px;width:65px;height:65px;' class='img-responsive' id='img"+i+"'></a></li>";

          $("#img_gallery_append").append(li_post);
    }
   }
 }
});

now on page code

   // Function for image pop up
     $(document).ready(function() {
       $('img').on('click', function() {
         $("#showImg").empty();
          // alert(this.id);
         var image = $(this).attr("src");
         $("#showImg").append("<img class='img-responsive' src='" + image + "' />")
     })
  });

What is the problem ? Could anyone help please ? ( Objective is opening the small image on the modal pop up..)

try to correct this

PP_PATH="php/"+result[i].Photo_URL;

with

PP_PATH="php/"+result.d[i].Photo_URL;

because result is object, and you need to catch the data with d

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM