1

Managed to parse an xml file with jquery and bring back the Photo tag string and display it in a p tag. (really long text) But want to decode/display the long text in image form. Please help...

<?xml version="1.0" standalone="yes"?>
  <SuperStarReport>
   <Record>
     <FullName>Jo Bloggs</FullName>
        <Photo>/9j/4AAQSkZJRgABAQEAYABgA..(long text)..fswafaw</Photo>

             (From separate XML file)





$.ajax({
url: 'xml/PhotoAsXML.xml',
dataType: 'xml',
success: function(data) {

  $(data).find('SuperStarReport Record').each(function(){

    var status = $(this).find('Photo').text();

      console.log(status);

        $('.timeline p').append(
          $('<p />', {
              text: status
          })
        );
  });
  },
  error: function() {
     $('.pic').text('failed to get feed');
   }
   });
adam
  • 39
  • 2
  • 1
    I think you'd like to [read this](https://stackoverflow.com/questions/8499633/how-to-display-base64-images-in-html) – 3Dos Oct 22 '17 at 17:42
  • Thanks - Just to add - the XML file will change from time to time so the base64 photo will be different in the xml file. Which is why i can't just copy the string manually. The status variable holds the current image/text value – adam Oct 22 '17 at 18:04
  • You’ve missed the point. Just concatenate `data:image/png;base64,` with the base64 data, and set that as the `src` of your `img` (change png to jpeg if appropriate). – jcaron Oct 22 '17 at 20:29
  • Thanks, how do i target a img/src tag in jquery? I have had a go but can't get anything to display var imag = 'src="data:image/jpeg;base64,' + status + '"/>' – adam Oct 23 '17 at 07:34

0 Answers0