1

I'm currently writing a JS class for my webshop application to access product information which is stored on the server. The information should be loaded asynchronously. For this I use dojo.xhrPost(). I want to rewrite a function for this class, called getProductName(productId:int):String which returns the product name for a given product id. The function uses intern dojo.xhrPost(). But whould should I return the loaded product name due to the fact that I have to pass new function to load and error in dojo.xhrPost()?

Usage of this function: Other JS functions call this to load the product name to update the cart webpage without reloading the whole page. The data returned is in JSON format due to the fact that some additional information is transferred for error handling (the client function has to know if any error occurred on server-side or not).

The code for the function getProductName(productId:int):

      function getProductName(productId) {
         dojo.xhrPost({
            url: '/shop/dataProduct.php',
            handleAs: 'json',
            content: {productId:productId},
            load: function(response, ioArgs) {
                 if (!response.error) {
                    // here I would like to return response.data to the caller of myObj.getProductName(productId)
                 } else {
                    // here I would like to return "error" to the caller of myObj.getProductName(productId)
                 }
                 return response;
            },
            error: function(response, ioArgs) {
                // here I would like to return "error" to the caller of myObj.getProductName(productId)
                return response;
            }
         });
      }

The usage:

           var productName = myObj.getProductName(5);
user1995621
  • 47
  • 3
  • 9
  • It's very difficult to answer a question like this without seeing any code. – AmericanUmlaut Mar 16 '13 at 10:19
  • What code should I show you? The code is simple, just a call to dojo.xhrPost() with a load function to return the response, but how should I return the response text to my calling JS function (which has called getProductName(...) on the object) if I have to add return response in the load and error function in dojo.xhrPost()? – user1995621 Mar 16 '13 at 10:55
  • added code to the question – user1995621 Mar 16 '13 at 11:20

1 Answers1

0

The problem with the following line of code is that it is assuming the the retrieval of the product name is synchronous. But you are making an ajax call to get the name and therefore the code is asynchronous.

var productName = myObj.getProductName(5);

You need to use dojo/Deferred to handle the asynchronous call.

function getProductName(productId) {

     var d = new dojo.Deferred();

     dojo.xhrPost({
        url: '/shop/dataProduct.php',
        handleAs: 'json',
        content: {productId:productId},
        load: function(response, ioArgs) {
             if (!response.error) {
                var productName = ???;
                d.resolve(productName);
             } else {
                d.reject(response.error);
             }
        },
        error: function(err) {
            d.reject(err);
        }
     });

     return d;
}

Usage:

getProductName(1).then(
  function(productName) {
     // do something with product name

  }, function(error) {
     // handle error
  });

http://dojotoolkit.org/reference-guide/1.8/dojo/Deferred.html

Craig Swing
  • 8,152
  • 2
  • 30
  • 43
  • I see in your sample code, that return response is not required, am I right? – user1995621 Mar 16 '13 at 12:03
  • Ok, I understand what I have to add. Good to know that I have not to change my class structure, only add something to my function calls. – user1995621 Mar 16 '13 at 12:06
  • correct. The xhr code that calls load and error do nothing with the return variable. – Craig Swing Mar 16 '13 at 12:07
  • One other thing unrelated to your question. Your call to get product name is more a GET than a POST. But that depends on how the server side code is implemented. POST implies you are changing data. GET implies you are simply retrirving data. – Craig Swing Mar 16 '13 at 12:09
  • Well, you are right but I always used POST, because I implemented it so in PHP and the object can also send a request to change the amount of a product in the cart (so it changes data). So through using POST everywhere I can reduce the effort for writing event handlers in PHP. – user1995621 Mar 16 '13 at 17:13