-1

I'm only able to append the first image in the <li>. I tried to use prepend rather than append, and it shows the last image only.

Can someone help me please?

$.ajax({
    url:'http://localhost/PHP/events.php',
    headers:{"Content-Type": "application/json"},
    type:'POST',
    data:$(this),
    dataType:'JSON',
    error:function(jqXHR,text_status,strError){
        alert(strError);
    },
    timeout:60000,
    success:function(data){
        for(var i in data){
            $("#Images").append("<li>"+data[i]+"</li>");                    
        }   
    }
});
6
  • Can you show us a dump of the entire JSON string? May 11, 2015 at 14:28
  • Check what your data returns and what is its length May 11, 2015 at 14:29
  • Maybe your data has only one item
    – Nakib
    May 11, 2015 at 14:31
  • 1
    I think that data:$(this), is the problem. Try send one field or whole the form.
    – Wilfredo P
    May 11, 2015 at 14:32
  • @RadonirinaMaminiaina it return 3 images, and this is what I have in my database. I have no problems with images I can display them without using <li>. But I need to display them in the <li>.
    – Khalid
    May 11, 2015 at 14:35

3 Answers 3

0

Into the success callback function, do this:

success:function(data){
    $.each(data, function(k, v) {
       $("#Images").append("<li>"+ v +"</li>");                    
     })  
}
1
  • won't produce anything different than a for loop would. Is a synchronous operation so no closure issues
    – charlietfl
    May 11, 2015 at 14:38
0
for(var i; i<=data.length; i++){
        $("#Images").append("<li>"+data[i]+"</li>");                    
    }

make sure about your data attribute name.

0
$.ajax({url:'http://localhost/PHP/events.php',
headers:{"Content-Type": "application/json"},
type:'POST',
data:$(this),
dataType:'JSON',
success:function(jqXHR,text_status,strError){
    alert(strError);},
    timeout:60000,
    success:function(data){
    var html='';
        for(var i in data){
            html += '<li>' + data[i] + '</li>'

        }
    $("#Images").append(html);
    }
});  

UpDated I don't under stand why there are two success methods

$.ajax({url:'http://localhost/PHP/events.php',
    headers:{"Content-Type": "application/json"},
    type:'POST',
    data:$(this),
    dataType:'JSON',
    success:function(data){
        var html='';
        for(var i in data){
           html += '<li>' + data[i] + '</li>'
         }
        $("#Images").append(html);
        },
    });  
3
  • code only answers aren't very useful without an explanation. Also can't have 2 success properties in the same object
    – charlietfl
    May 11, 2015 at 14:42
  • @charlietfl so what should I do then?
    – Khalid
    May 11, 2015 at 14:47
  • You really should explain why your answer would solve the problem. and what you did to fix it
    – charlietfl
    May 11, 2015 at 14:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.