CODEWITHSUNDEEP
sitefinity
Wade73
Wade73

Reputation: 4519

Sitefinity Page Widget Removing HTML When Rendered

I am working on creating a page widget for Sitefinity, using Vue to show some jobs. The problem is that when the page is rendered on the front end, the html that Vue is using to display results is removed. So here is the original html and vue js code from my jobs.ascx file:

<div class="col-md-4">
  <ul class="latestjobs">
    <li v-for="job in jobs">{{jobname}}<br /><em>{{companyname}}</em></li>
  </ul>
</div>

var app = new Vue({
    el: ".latestjobs",
    data: {
        jobs: [
            { "jobname": "Test", "companyname": "Test" }
        ]
    }
});

This is what is rendered on the page:

<div class="col-md-4">
  <!---->
</div>

I can't seem to find any reference as to why this might be happening, so any help in fixing this would be appreciated.

Upvotes: 0

Views: 530

Answers (2)

Wade73
Wade73

Reputation: 4519

The solution was to create a new HtmlSanitizer class with the tags you want to allow. Here is what I used for the class:

using Telerik.Sitefinity.Security.Sanitizers;

namespace SitefinityWebApp.Infrastructure.Classes
{
    public class SitefinityExtendedHtmlSanitizer : HtmlSanitizer
    {
        public SitefinityExtendedHtmlSanitizer()
        {
            base.AllowedTags.Add("iframe");
            base.AllowedAttributes.Add("id");
            base.AllowedAttributes.Add("v-for");
        }
    }
}

Then I had to register it in the global.asax. Here is the code:

protected void Application_Start(object sender, EventArgs e)
        {
            ObjectFactory.Initialized += RegisterCommonTypesEventHandler;
        }

        private void RegisterCommonTypesEventHandler(object sender, ExecutedEventArgs e)
        {
            if (e.CommandName == "RegisterCommonTypes")
            {
                ObjectFactory.Container.RegisterType<IHtmlSanitizer, SitefinityExtendedHtmlSanitizer>(new ContainerControlledLifetimeManager());
            }
        }

This all pertains to Sitefinity 10.2.

Wade

Upvotes: 0

Peter Filipov
Peter Filipov

Reputation: 36

Have you tested it with MVC widget/templates (Feather)? May be the rending engine escapes it? Also, if you remove(comment) the the vuejs script, does the widget renders the html?

Upvotes: 0

Related Questions