Forum Discussion

Deadmike's avatar
Deadmike
Copper Contributor
Feb 19, 2020

Sharepoint putting extra "src" information in <img> tags

Hello,

 

I'm trying to find a resolution to a problem i have never came across previously.

I have created a quill rich text editor where i intend to put text and images that i can store as html in sharepoint lists in order to load it on a custom landing page instead of updating the html code itself every time there is new content.

 

While storing formatted text works perfectly, i am facing an issue whereas <img> tags get altered by sharepoint by adding an extra URL in them before the actual URL of the image. This makes the <img src="" property incorrect and the image doesnt load. I tried with reading the element from the DOM and altering the property with javacript.replace, but whenever i load the corrected code back to the DOM, sharepoint puts the extra (wrong) link snippet back to its place.

 

example: 

URL of the image i upload as html code into a list:

<div class=""><p><img class="class" src="https://company.sharepoint.com/sites/PortalName/DocumentLibraryname/image.jpg" data-themekey=""></p></div>

 

Then what comes out when rendering the DOM is:

<div class=""><p><img class="class" src="https://company.sharepoint.com/pages/%22https://company.sharepoint.com/sites/PortalName/DocumentLibraryname/image.jpg" data-themekey=""></p></div>

 

Notice the addition of an extra url part in bold. I tried replacing the parts i dont need in "src" with javascript, and even though console.log-ing displays the corrected value, when i put it back as innerHTML to its place, the wrong link gets added back. The process of reading the content of a sharepoint list item, putting it into a var and replacing stuff is connected to an onClick event, therefore document.ready shouldn't be an issue. 

Has anyone face this issue before?

Any help would be much appreciated!

Thanks!

 

 

No RepliesBe the first to reply

Resources