$.Ajax doesnt work in windows8 metro app

Question

I am trying to migrate my existing html5 app into a metro app, and finding two major hurdles:

.innerHtml is not supported due to security reason
$.Ajax just doesn't work (I am using jsonp for data exchange from server)

Questions:

How do I bypass the security issue for .innerHtml?
What other alternative do I have to make $.Ajax work?

You aren't supposed to use jQuery AJAX or normal AJAX in WinJS. IIRC there is a special xhr object you must use instead (which means you don't need JSONP, just JSON). — Andrea, Apr 28 '12 at 14:40
This is better answered in another stack overflow question: http://stackoverflow.com/questions/10859523/using-jquery-with-windows-8-metro-javascript-app-causes-security-error — techsaint, Jul 02 '12 at 14:13

score 1 · Accepted Answer · answered Apr 28 '12 at 19:12

Q2: I had the similar problem, and I changed my $.get to:

function getJSON(url, data, callback, errorCb) {
if (data != null)
{
    var params = [];
    for (var key in data) {
        params.push(key + "=" + encodeURI(data[key]));
    }
    url += "?" + params.join("&");
}

WinJS.xhr({ url: url }).then(
    function (result) {
        if (callback != null)
            callback(result.response, result.status);
    },
    function (result) {
        if (errorCb)
            errorCb(result.status);
    });
}

score 0 · Answer 2 · answered Apr 29 '12 at 06:37

Q1: WinRT block throws exceptions or warnings when you use .innerHtml for dynamic content. But they don't block you from using .innerHTML all the time. Have you tried toStaticHTML method like following:

element.querySelector("#myId").innerHTML = "some string" + toStaticHTML(yourHTMLContent);

Q2: regular javascript xhr call works for me. Actually I believed that I used .ajax to send some simple GET or POST request before, but ended up using xhr for some other reasons

Hope this helps.

$.Ajax doesnt work in windows8 metro app

2 Answers2

Linked