Firefox SDK + JQuery AJAX problems -


i'm working on add-on firefox using sdk (previously known jetpack).

in add-on need access data via jsonp requests php script on remote server (which i'm in control of), , use data returned server update web page elements.

in main.js file use page-mod , contentscriptfile inject copy of jquery library, , own javascript file web page. javascript file uses jquery's "$.ajax" function access remote php script.

the problem: responses never received.

i stumbled across stackoverflow question, deals same issue: error in jsonp call firefox-extension

i've followed of advice there, , changed $.ajax request specifying own callback, , added callback function file using "unsafewindow.callback" - don't understand what's happening, seems "window" reference acquired jquery not the same real underlying window object (i thought sort of thing meant handled invisibly xraywrapper, confused that).

that's ok. single parameter passed callback (i've labelled parameter "data"), contains entire server response - need.

the problem is, when using success: within .ajax function, "this" referred ajax object (i think - javascript beginner), , thence page element wanted update response data. lose access "this" in custom callback.

what i've found though response server, , callback fires, jquery reports error - if specify error:, fire. if add complete:, fires too, success: never fires.

i thought use :complete in place of custom callback, appears when error handling code invoked, wipes out server response - can't access in complete: (the xhr object .responsetext property "undefined" time processing reaches complete:).

so, cobbled solution of follows. have custom callback, passed full server response. store in global variable. specify complete: - fires next (or later) - , access global variable there, have access page element want update via "this".

this concerns me because several ajax requests may made in quick succession, solution depends upon there being no "interleaving" of response handling - in other words, i'm making assumption (which don't know true) when response received jquery, fire of event handlers response before beginning processing of next received response. if isn't so, data store in global variable may not correspond page element want use in success:. seems working far in testing, may i've been lucky.

(side note: use qtip2, , it's ajax plugin - throws error too, , not silent one. found suppress adding error: , setting xhr.status = 0 - i'll post snippet below).

but seems such horrible messy way of doing things. don't understand why jquery thinks there's been error when server response received successfully. , it's inconvenient error handling destroys response means can't @ in success:.

does have neater solution? thank in advance - snippets follow (by way, these problems exist when of within add-on. if same stuff in stand-alone page/script, executes without errors being raised, , expected).

unsafewindow.callback = function(data) {   myglobalserverresponsevariable = data; }  $.ajax( {   url: 'http://nottherealurl.com/',   type: 'get',   data: params,   async: true,   cache: false,   contenttype: "text/json; charset=utf-8",   datatype: 'jsonp',   crossdomain: true,   jsonpcallback: "callback",    complete: function(xhr, textstatus)   {     var data = myglobalserverresponsevariable;     this.pageelementiwanttoupdate.attr("title", data.somevalue);     ...   } ... } 

qtip2 error suppression:

error: function(xhr, status, error) {   xhr.status = 0; } 

final note, not directly related above - when "file->open file" in firefox , select web page, add-on not executed. design?

i suggest moving data loading logic main.js, use request api available in context load data (see https://addons.mozilla.org/en-us/developers/docs/sdk/latest/modules/sdk/request.html ).

when data loaded, can send data page via extension -> page messaging ( https://addons.mozilla.org/en-us/developers/docs/sdk/latest/dev-guide/guides/content-scripts/using-port.html ).


Comments

Popular posts from this blog

ios - UICollectionView Self Sizing Cells with Auto Layout -

node.js - ldapjs - write after end error -

DOM Manipulation in Wordpress (and elsewhere) using php -