1

I'm developing an app using Worklight 5.0.6. The app is targeted at tablets (iOS, Android and Windows). The app works fine on iOS and Android, but I'm having trouble getting it to run properly on Windows 8. The app crashes when I click on a link. Here's part of the error message:

"HTML1701: Unable to add dynamic content '  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>'. A script attempted to inject dynamic content or elements previously modified dynamically that might be unsafe. For example, using the innerHTML property to add script or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content or explicitly create elements and attributes with a method such as createElement. For more information, see http://go.microsoft.com/fwlink/?LinkID=247104."

The app is supposed to inject a html fragment when a link is clicked. I'm using the following the following functions to inject html into an element:

function loadPartial(path, elementId)
{
    $.get(path, function (data) {
        $(elementId).html(data).trigger("create");
        $("#my-navbar > ul").removeClass("ui-grid-a");
        if (!hideDuringFocus)
        {
            $("[data-role=header]").fixedtoolbar({ hideDuringFocus: "" });
            $("[data-role=footer]").fixedtoolbar({ hideDuringFocus: "" });
        }
    });
}

function loadPartialWithFunction(path, elementId, aFunction)
{
    $.get(path, function (data) {
        $(elementId).html(data).trigger("create");
        $("#my-navbar > ul").removeClass("ui-grid-a");
        if (!hideDuringFocus)
        {
            $("[data-role=header]").fixedtoolbar({ hideDuringFocus: "" });
            $("[data-role=footer]").fixedtoolbar({ hideDuringFocus: "" });
        }
        aFunction();
        });
} 

Is there a mistake I made in the code? Any help would be appreciated. Please let me know if more information or source code is needed.

adriank
  • 143
  • 11

2 Answers2

2

The issue has been resolved, thanks. I have to wrap the code with MSApp.execUnsafeLocalFunction so it'll look this:

function loadPartialWithFunction(path, elementId, aFunction)
{
    $.get(path, function (data) {
        MSApp.execUnsafeLocalFunction(function(){
            $(elementId).html(data).trigger("create");
            $("#my-navbar > ul").removeClass("ui-grid-a");
            if (!hideDuringFocus)
            {
                $("[data-role=header]").fixedtoolbar({ hideDuringFocus: "" });
                $("[data-role=footer]").fixedtoolbar({ hideDuringFocus: "" });
            }
            aFunction();
       });
    });
}  
adriank
  • 143
  • 11
1

This is an issue with jQuery on Win8 Metro. Metro apps have dynamic content restrictions, that need to be bypassed first. Here is a stack overflow question with lots of answers for this issue:

Using jQuery with Windows 8 Metro JavaScript App causes security error

Community
  • 1
  • 1
Mike
  • 526
  • 7
  • 18