Render HTML data in the editor

jcbeau

Hello,

Is there a way to render HTML data in the editor? Perhaps using a custom or different field type? I don't want to edit the data, only display it to the user as rendered HTML.

Right now, I'm doing it in a text field and the user sees:

allan

Hi Jeff,

There isn't a built in way of displaying raw HTML, however, I can certainly see that this might be quite useful.

I've just put this little plug-in together which will display plain HTML:

[code]
$.fn.dataTable.Editor.fieldTypes.display = {
"create": function ( conf ) {
conf._div = $('').attr( $.extend( {
id: conf.id
}, conf.attr || {} ) );

return conf._div[0];
},

"get": function ( conf ) {
return conf._rawHtml;
},

"set": function ( conf, val ) {
conf._rawHtml = val;
conf._div.html( val );
},

"enable": function ( conf ) {},

"disable": function ( conf ) {}
};
[/code]

Just set the field type to `display` and the rest of the interface should be exactly what you'd expect from the rest of the Editor API.

It is worth noting that this will submit the HTML that you set as part of the form. That might or might not be what you want. Interestingly, Editor fields don't actually have the option of not being included in the submitted data at the moment (other than using the onPreSubmit etc events to modify the data), which is something I'll look at addressing.

Regards,
Allan

jcbeau

Hi Allan,

Thank you so much for this plugin. I tested it and it almost works! For my test I made the data = "TEST" and the word TEST is invisible, but if I click on the place where TEST should be it works!

Most likely a style sheet issue eh?

Oops! It was a style sheet issue, I figued it out. My bad.

Thanks again for the excellet support.

Thanks! --Jeff

allan

Great to hear that does the business for you!

Regards,
Allan