I've been at this for like 16 hours now, so its time to post on SO!!! I am trying to query a database for img URLs, encode that into an array (presumably with JSON), then retrieve that information via AJAX request, then insert that information into Photoswipe.
Here is my code to encode the PHP array with JSON.
$Path = "{src: '../images/banduploads/" . $row[0] . "." . $row[1] . "', w: 200, h: 900 }";
$data[$i] = $Path;
$i+=1;
};
print json_encode($data);
Array data after being encoded:
["{src: '..\/images\/banduploads\/1.png', w: 200, h: 900 }","{src: '..\/images\/banduploads\/3.jpg', w: 200, h: 900 }","{src: '..\/images\/banduploads\/4.jpg', w: 200, h: 900 }"]
AJAX receives the array
$.ajax({
url: "galleryload.php",
type: 'POST',
dataType: 'json', // will automatically convert array to JavaScript
success: function(data) {
var options = {
index: 0 // start at first slide
};
// Initializes and opens PhotoSwipe
var gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, data, options);
gallery.init();
}
});
Data after AJAX is the exact same as before ajax, without the escape slashes.
Error caused on this line:
Ba("initialLayout", function() {
f.currItem.initialLayout = i.getThumbBoundsFn && i.getThumbBoundsFn(m)
}),
and in chrome I receive this error in console, which is not on Google anywhere for some Godforsaken reason:
"Uncaught TypeError: Cannot create property 'initialLayout' on string '{src: '../images/banduploads/1.png', w: 200, h: 900 }'"
Please Christ somebody help me