loop over the PHP data Returned to jquery AJAX Call

Question

below is my $.ajax call to php

$(document).ready(function() {
$('ul.sub_menu a').click(function(e) {
e.preventDefault();
    var txt = $(this).attr('href');
    $.ajax({
        type: "POST",
        url: "thegamer.php",
        data:{send_txt: txt},
        success: function(data){
            $('#container').fadeOut('8000', function (){
                $('#container').html(data);
                $('#container').fadeIn('8000');
            });
        }   
    });
});
});

my php code

    if(mysql_num_rows($result) > 0){
    //Fetch rows
    while($row = mysql_fetch_array($result)){

        echo $row['img'];

        }
}

I m getting this output

images/man/caps/army-black.pngimages/man/caps/army-brown.pngimages/man/caps/army-grey.pngimages/man/caps/army-lthr.pngimages

these are basically image paths now how to loop over them in jquery and fit each image in image tag

any code will be useful

Plz Note I DONT NEED JSON

regards sajid

Are you saying $row['img'] has multiple image names in it and you need to break them down, or is all you need to do change the echo to add image tags? echo "<image>".$row['img']."</image>"; — John3136
– John3136, Commented Jan 30, 2012 at 4:14
@john yes it has multiple image paths displayed in a div at jquery side i want to break them there at jquery end loop over it and fit it int img src='data[0]' /img — sajid
– sajid, Commented Jan 30, 2012 at 4:17

Kane Wallmann · Accepted Answer · 2012-01-30 04:34:45Z

3

JSON is probably your best bet here. In PHP do something like this:

$ret = array();

while( $row = mysql_fetch_assoc( $result ) )
{
    $ret[] = $row['img'];
}

echo json_encode( $ret );

This will output something like the following

["image1","image2","image3"]

jQuery has a function which can convert this information into a javascript array. So put this code in your success callback.

var result = jQuery.parseJSON( data );

alert( result[1] );

EDIT: A method which does not use JSON

In PHP place each image url on a separate line

echo $row['img'], "\n";

Then in javascript, split the response by the new line character

var result = data.split( "\n" );

edited Jan 30, 2012 at 4:34

answered Jan 30, 2012 at 4:17

Kane Wallmann

2,32215 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Kane Wallmann Over a year ago

sajid, JSON is simply a way of serializing information to a string. It doesn't require any additional frameworks or libraries or anything like that. What is the reason behind not wanting to use JSON?

Kane Wallmann Over a year ago

I have updated my answer to include an approach which does not use JSON

sajid Over a year ago

I M TIRED OF JSON IT RETURN THIS ["images\/man\/caps\/army-black.png","images\/man\/caps\/army-brown.png","images\/man\/caps\/army-grey.png"] when i apply this var result = jQuery.parseJSON( data ); alert( result[1] ); it doesnt work and gives <!html Doctype> the basic problem is this i need to loop over that data and fit it in img src and apppend it to dom

Kane Wallmann Over a year ago

sajid, if you are getting "<!DOCTYPE html>" then your PHP script must be writing more information to the browser then just the image urls. Does "thegamer.php" have any other code above the bit you posted?

sajid Over a year ago

working with ur edit 'echo $row['img'], "\n";' success: function(data){ var result = data.split( "\n" ); var i; for (i = 0; i < result.length; ++i) { $('#container').fadeOut('8000', function (){ $('#container').html(result[i]); $('#container').fadeIn('8000'); } now im getting this error The requested URL /new/mcaps was not found on this server.

|

Ket. · Accepted Answer · 2012-01-30 06:53:01Z

0

simply change your php code: `if(mysql_num_rows($result) > 0){

while($row = mysql_fetch_array($result)){

    echo ""<img src='".$row['img']."' /><br />";
  }  }

answered Jan 30, 2012 at 6:53

Ket.

7744 silver badges12 bronze badges

Collectives™ on Stack Overflow

loop over the PHP data Returned to jquery AJAX Call

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related