TinyMCE removes my code and changes my html, none of the solution is working

Question

I am using Tiny MCE Editor, when i save my html text it removes my content automatically, i have reviewed many solutions on different forums but none of them resolves this problem.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Receipt Creation Failure</title> </head> <body style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333;"> <div style="border:1px; border-color:#003; border-style:solid; width:600px; float:left"> <div style="float:left; padding-top:20px; width:560px; padding:20px; min-height:200px; "> <strong>Dear Team, </strong><br /> <br /> There was a payment attempt from the Test named <b>{TestName}</b> placed at <b>{TestLocation}</b>. <br This is a system generated message, please do not reply to this email address since it is not monitored.<br /> <br /> <strong>Thank you <br /> xyz Support Team </strong></div> <div style="width:580px; padding:10px; background-color:#132c4d; height:10px; text-align:right; clear:both; color:#FFF; text-decoration:none"><a style="color:#FFF; text-decoration:none;" href="https://emaar.service-now.com/" target="_blank">Contact Us</a> | <a href="http://xyz.ae/" target="_blank" style=" color:#FFF; text-decoration:none;">xyz.ae</a></div> </div> </body> </html>

When i save this information, it converts it into

 <p>Receipt Creation Failure</p> <div style="border: 1px; border-color: #003; border-style: solid; width: 600px; float: left;"> <div style="float: left; padding-top: 20px; width: 560px; padding: 20px; min-height: 200px;"><strong>Dear Team, </strong><br /> <br /> There was a payment attempt from the Test named <strong>{TestName}</strong> placed at <strong>{TestLocation}</strong>. <br /> <br /> <strong>Thank you <br /> xyz Support Team </strong></div> <div style="width: 580px; padding: 10px; background-color: #132c4d; height: 10px; text-align: right; clear: both; color: #fff; text-decoration: none;"><a style="color: #fff; text-decoration: none;" href="https://emaar.service-now.com/" target="_blank">Contact Us</a> | <a style="color: #fff; text-decoration: none;" href="http://xyz.ae/" target="_blank">xyz.ae</a></div> </div>

Please help.

Answer 1

This is not an answer, but the comments are not good at formatting code.

This is a content editor, it will not behave like you expect with doctype and headers.
Try to prune your HTML, keeping only the content of <body> . In your case:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Receipt Creation Failure</title> </head> <body style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333;"> <div style="border:1px; border-color:#003; border-style:solid; width:600px; float:left"> <div style="float:left; padding-top:20px; width:560px; padding:20px; min-height:200px; "> <strong>Dear Team, </strong> <br /> <br /> There was a payment attempt from the Test named <b>{TestName}</b> placed at <b>{TestLocation}</b>. <br This is a system generated message, please do not reply to this email address since it is not monitored.<br /> <br /> <strong>Thank you <br /> xyz Support Team </strong> </div> <div style="width:580px; padding:10px; background-color:#132c4d; height:10px; text-align:right; clear:both; color:#FFF; text-decoration:none"> <a style="color:#FFF; text-decoration:none;" href="https://emaar.service-now.com/" target="_blank">Contact Us</a> | <a href="http://xyz.ae/" target="_blank" style=" color:#FFF; text-decoration:none;">xyz.ae</a> </div> </div> </body> </html>

Becomes:

 <div style="border:1px; border-color:#003; border-style:solid; width:600px; float:left"> <div style="float:left; padding-top:20px; width:560px; padding:20px; min-height:200px; "> <strong>Dear Team, </strong> <br /> <br /> There was a payment attempt from the Test named <b>{TestName}</b> placed at <b>{TestLocation}</b>. <br This is a system generated message, please do not reply to this email address since it is not monitored.<br /> <br /> <strong>Thank you <br /> xyz Support Team </strong> </div> <div style="width:580px; padding:10px; background-color:#132c4d; height:10px; text-align:right; clear:both; color:#FFF; text-decoration:none"> <a style="color:#FFF; text-decoration:none;" href="https://emaar.service-now.com/" target="_blank">Contact Us</a> | <a href="http://xyz.ae/" target="_blank" style=" color:#FFF; text-decoration:none;">xyz.ae</a> </div> </div>

Maformed HTML:
<br This is a system generated message, please do not reply to this email address since it is not monitored.

In the end you should have more or less what TinyMCE got.

Answer 2

Did you try the tinyMCE.activeEditor.getContent({format : 'raw'}); ?

TinyMCE removes my code and changes my html, none of the solution is working

Question

2 answers

solution1
0

This is not an answer, but the comments are not good at formatting code.

solution2
0 2017-09-07 13:33:47

TinyMCE removes my code and changes my html, none of the solution is working

Question

2 answers

solution1 0

This is not an answer, but the comments are not good at formatting code.

solution2 0 2017-09-07 13:33:47

solution1
0

solution2
0 2017-09-07 13:33:47