Stop TinyMCE 4.1.9 from removing orphaned children tags - tinymce-4

I am wanting to use ANY tag inside of TinyMCE without it being removed, but it's not working. My current input is:
<tr><td>[item-thumb]</td><td>[item-count]</td><td>[item-location]</td><td>[item-title]</td><td>[item-desc]</td><td>[low-estimate]</td></tr>
This is used to iterate through items and replace the short-codes with item data, and put that into a table. However, it always strips out the tr and td tags because it is not wrapped in a table tag.
I've tried:
valid_elements: "+*[*]",
valid_children: "+*[*]",
extended_valid_elements: "+*[*]",
verify_html: false,
cleanup: false,
cleanup_on_startup : false,
I know some of these are deprecated, but I'm willing to try anything at this point.

The issue you are running into is that TinyMCE is designed to create valid, well-formed (X)HTML. If you attempt to create table related tags but don't wrap them in a table the HTML cleanup/validation routine will always do its best to cleanup the content to make it valid.
There is no way to disable this validation.

Why don't you just wrap them in a <table>, then just remove <table> and </table> just before saving?
I have done that for something else, but with TinyMCE.
I have the full code in the textarea (where the content of the TinyMCE is), and then used javascript to remove the unwanted code (<table> and </table> in your case) before saving it to a file.
It will work this way:
IF you load the content of the textarea from a database, then just prefix and suffix the content with what you need to make TinyMCE work.
Then get the content from the textarea when you are going to save it, BUT remove the prefix and suffix before writing it to the database/ file.
Doing this should be easy, and gives you endless possibilities.
(You could either do that by javascript, or by PHP (or whatever server side language you use).)

Related

How to allow goog.html.sanitizer.HtmlSanitizer.Builder to permit the "placeholder" attribute

I use goog.html.sanitizer.HtmlSanitizer.Builder to create safe HTML that I then dynamically insert into a dialog. I wanted to have an input field that uses the Html 5 "placeholder" attribute.
I tried
.alsoAllowTagsPrivateDoNotAccessOrElse ([ "placeholder"])
and got an expected nasty compiler error!
I ended up adding the place holder attribute to the closure-library attribute white list javascript code. The call to alsoAllowTagsPrivateDoNotAccessOrElse was removed and all worked well.

Passing html in string in include

I have the code below and I need to pass an html element (anchor) as shown. I have tried using filters like raw and escape but it always prints out the html element as regular text. I also tried setting a new variable that contains the same string text and passed that to testLink and then applied filters to it, but same result. Any ideas how to tackle this problem?
{% include 'example.html.twig' with {'testLink': 'Hurry, Click me NOW'} %}
You cannot handle your problem in the template that is including the example.html.twig template as autoescaping will step in when the passed value is displayed in the included template. Instead, you will have to use the raw filter in example.html.twig (be careful with that solution though as the template is probably used in other places too which might not be safe).

“field-with-errors” wrapper changes the page appearance with <pre> tag in ruby on rails

I am using <div class="field_with_errors"> to show validation errors with twitter bootstrap. But when validation error appears, these create extra space between controls that cause whole UI gets broken as you can see from image. How to avoid this extra space. Second thing that I want to display validation errors in front of controls not below. How it would be possible. When I tried to debug this css using Firbug, I got to know there is <pre> </pre> HTML tae and they causing this extra space. I have put red color for extra space in image.
Please suggest me how to avoid this extra space and get validation errors on right side of controls (infront). Please let me know if you need more code to be pasted.
By default Rails is going to inject a block element into your form. This is where
<div class="field_with_errors">
comes from. To avoid the extra space you need to have Rails inject an inline element, such as a span. To do this go into config/application.rb include this:
module YourApp
class Application < Rails::Application
config.action_view.field_error_proc = Proc.new do |html_tag, instance|
"<span class=\"field_with_errors\">#{html_tag}</span>".html_safe
end
end
end
This configuration gives Rails a Proc function to call that will now generate your form error elements. You can alter this html to your pleasing. You can find more information here:
http://guides.rubyonrails.org/configuring.html#configuring-action-view

HTML tag to allow removable &nbsp

Does anyone know of a way to contain a nonbreaking space in an html tag to allow me to remove it based on conditions tested during runtime in the code behind?
Basically why I need this: if a condition is satisfied I will have 4 buttons, but if it's not only three. I can remove the button but then I have 4 in-between 2 of the buttons instead of just 2 .
Something like the <del> tag would work if it didn't strike through the text.
Basically I have something like this(propery values not included for simplicity):
<td><button />&nbsp&nbsp<button />&nbsp&nbsp<button />&nbsp&nbsp<button /></td>
I can't have the function in the actual button tag because then it will render the &nbsp instead of the button text.
EDIT:
I did end editing the &nbsp tags out and using css. I appreciate all of the responses.
The main reason that I was apprehensive to go that route to being with is because trying to get my client to approve anything is like pulling teeth, but I got them to approve the changes and adjust the budget.
Thanks again!!
Does it need to be ? Based on your description of the requirement, it sounds like a bit of CSS might work better:
button.myClass {
margin-left: 1ex;
}
Much simpler than trying to put logic in your view layer (even if you are not strictly following the MVC pattern you should still try to separate your presentation and business logic as much as possible).
You should not use for layout.
If you want to output some HTML content directly on the page without controls - you can use Embedded Code Blocks:
<button/><% =GetNecessaryNbsp() %><button/>
Where GetNecessaryNbsp() in the page class would return necessary number of .

Input Validation When Using a Rich Text Editor

I have an ASP.NET MVC application and I'm using CKEditor for text entry. I have turned off input validation so the HTML created from CKEditor can be passed into the controller action. I am then showing the entered HTML on a web page.
I only have certain buttons on CKEditor enabled, but obviously someone could send whatever text they want down. I want to be able to show the HTML on the page after the user has entered it. How can I validate the input, but still be able to show the few things that are enabled in the editor?
So basically I want to sanitize everything except for a few key things like bold, italics, lists and links. This needs to be done server side.
How about AntiXSS?
See my full answer here from similar question:
I have found that replacing the angel
brackets with encoded angel brackets
solves most problems
You could create a "whitelist" of sorts for the html tags you'd like to allow. You could start by HTML encoding the whole thing. Then, replace a series of "allowed" sequences, such as:
"<strong>" and "</strong>" back to "<strong>" and "</strong>"
"<em>" and "</em>" back to "<em>" and "</em>"
"<li>" and "</li>" back to ... etc. etc.
For things like the A tag, you could resort to a regular expression (since you'd want the href attribute to be allowed too). You would still want to be careful about XSS; someone else already recommended AntiXSS.
Sample Regexp to replace the A tags:
<a href="([^"]+)">
Then replace as
<a href="$1">
Good luck!

Resources