Page 1 of 1

jquery asynchronous events issue

Posted: Thu Jul 17, 2014 6:47 pm
by Terry Gilliver

I am firing a database service in a loop and passing it a quantity variable which can change for each itteration. The problem is that because of its asynchronous tendencies, the quantity is always the that of the last itteration. How can I make sure to pass the right quantity on each itteration?

see code

pre
///
/// run on create_order success event
/// This will write the line items to the Order (LineItems Collection)
///
/// Parameters: None
///
/// Returns: None
///
function createOrderSuccess(data) {
console.log('Order table written successfully');

Code: Select all

 //get the order id 
 var orderId = data._id; 
 console.log("Order ID = " + orderId); 
 //success function for get_product_id 
 function successFunction(data, quant, orderId) { 
     // 
     // 
     // The quant value above is always the same! 
     // 
     // 
     var productId =  data[0]._id; 
     console.log("product ID = " + productId); 
     // now we have the orderid and product id we can write the lineItem to the collection 
     add_order_item.execute({ 
         data: { 
             "ItemId": {'collName': 'ProductItems', '_id': productId}, 
             "Quantity": quant, 
             "OrderId" : {'collName': 'Orders', '_id': orderId } 
         }, 
         success: function(data) { 
             console.log("Line Item written successfully");    
         } 
     }); 
 } 

 // now need to add the order items 
 var item; 
 var quantity; 
 for (i = 1; i < shoppingBasket&#46;length; i++) { 
     &#47;&#47;get item and quantity 
     quantity = shoppingBasket[i][1]; 
     console&#46;log("quantity = " + quantity); 
     item = shoppingBasket[i][0]; 
     console&#46;log("item = " + item); 

     &#47;&#47;get product data 
     get_product_id&#46;execute({ 
         data: { 
             "where": '{"ItemName":"' + item + '"}' 
         }, 
         success: function(data) { 
             successFunction(data, quantity, orderId); 
         } 
     }); 
 } 

}
/pre


jquery asynchronous events issue

Posted: Thu Jul 17, 2014 8:53 pm
by Kateryna Grynko

Hi Terry,

Please use Closures: https://developer.mozilla.org/en-US/d...


jquery asynchronous events issue

Posted: Mon Jul 21, 2014 7:25 pm
by Terry Gilliver

I have tried to get my head around closures, but I still can't see how to get it to work. This is the code I have tried:

pre
&#47;&#47;/
&#47;&#47;/ run on create_order success event
&#47;&#47;/ This will write the line items to the Order (LineItems Collection)
&#47;&#47;/
&#47;&#47;/ Parameters: data (returned from create_order service)
&#47;&#47;/
&#47;&#47;/ Returns: None
&#47;&#47;/
function createOrderSuccess(data) {
console&#46;log('Order table written successfully');

Code: Select all

 &#47;&#47;get the order id 
 var orderId = data&#46;_id; 
 console&#46;log("Order ID = " + orderId); 
 &#47;&#47;success function for get_product_id 
 function successFunction(data, quant, orderId) { 

     var productId =  data[0]&#46;_id; 
     console&#46;log("product ID = " + productId); 
     &#47;&#47; now we have the orderid and product id we can write the lineItem to the collection 
     add_order_item&#46;execute({ 
         data: { 
             "ItemId": {'collName': 'ProductItems', '_id': productId}, 
             "Quantity": quant, 
             "OrderId" : {'collName': 'Orders', '_id': orderId } 
         }, 
         success: function(data) { 
             console&#46;log("Line Item written successfully");    
         } 
     }); 
 } 

 function quantity(q) { 

     return function() { 
         return shoppingBasket[q][1]; 
     }; 
 } 

 &#47;&#47; now need to add the order items 
 var item; 
 for (i = 1; i < shoppingBasket&#46;length; i++) { 

     item = shoppingBasket[i][0]; 
     console&#46;log("item = " + item); 

     &#47;&#47;get product data 
     get_product_id&#46;execute({ 
         data: { 
             "where": '{"ItemName":"' + item + '"}' 
         }, 
         success: function(data) { 
             successFunction(data, quantity(i), orderId); 
         } 
     }); 
 } 

}
/pre


jquery asynchronous events issue

Posted: Tue Jul 22, 2014 1:06 am
by Yurii Orishchuk

Hi Terry,

Please learn code below to understand how closure works.

pre

&#47;&#47;
&#47;&#47;/ run on create_order success event
&#47;&#47;/ This will write the line items to the Order (LineItems Collection)
&#47;&#47;/
&#47;&#47;/ Parameters: None
&#47;&#47;/
&#47;&#47;/ Returns: None
&#47;&#47;/
function createOrderSuccess(data) {
console&#46;log('Order table written successfully');
&#47;&#47;get the order id
var orderId = data&#46;id;
console&#46;log("Order ID = " + orderId);
&#47;&#47;success function for get_product_id
function successFunction(data, quant, orderId) {
&#47;&#47;
&#47;&#47;
&#47;&#47; The quant value above is always the same!
&#47;&#47;
&#47;&#47;
var productId = data[0]&#46;id;
console&#46;log("product ID = " + productId);
&#47;&#47; now we have the orderid and product id we can write the lineItem to the collection
add_order_item&#46;execute({
data: {
"ItemId": {'collName': 'ProductItems', 'id': productId},
"Quantity": quant,
"OrderId" : {'collName': 'Orders', 'id': orderId }
},
success: function(data) {
console&#46;log("Line Item written successfully");
}
});
}

Code: Select all

 var GetProduct = function(data, quantity, orderId, i, length){ 
     get_product_id&#46;execute({ 
         data: { 
             "where": '{"ItemName":"' + item + '"}' 
         }, 
         success: function(data) { 
             &#47;&#47;Here you can access correct "i" and "length" variables to make condition you need or send these values to the "successFunction" 
             successFunction(data, quantity, orderId); 
         } 
     }); 

 }; 

 &#47;&#47; now need to add the order items 
 var item; 
 var quantity; 
 for (i = 1; i < shoppingBasket&#46;length; i++) { 
     &#47;&#47;get item and quantity 
     quantity = shoppingBasket[i][1]; 
     console&#46;log("quantity = " + quantity); 
     item = shoppingBasket[i][0]; 
     console&#46;log("item = " + item); 
     &#47;&#47;get product data 
     &#47;&#47;get_product_id&#46;execute({ 
     &#47;&#47;    data: { 
     &#47;&#47;        "where": '{"ItemName":"' + item + '"}' 
     &#47;&#47;    }, 
     &#47;&#47;    success: function(data) { 
     &#47;&#47;        successFunction(data, quantity, orderId); 
     &#47;&#47;    } 
     &#47;&#47;}); 
     GetProduct(data, quantity, orderId, i, shoppingBasket&#46;length); 
 } 

}

/pre

Take a look on "GetProduct" function.

Regards.


jquery asynchronous events issue

Posted: Tue Jul 22, 2014 2:22 pm
by Terry Gilliver

Great, Thanks, i get it now and it now works a treat! THis was my final code:

pre
&#47;&#47;/
&#47;&#47;/ run on create_order success event
&#47;&#47;/ This will write the line items to the Order (LineItems Collection)
&#47;&#47;/
&#47;&#47;/ Parameters: data (returned from create_order service)
&#47;&#47;/
&#47;&#47;/ Returns: None
&#47;&#47;/
function createOrderSuccess(data) {
console&#46;log('Order table written successfully');

Code: Select all

 &#47;&#47;get the order id 
 var orderId = data&#46;_id; 
 console&#46;log("Order ID = " + orderId); 
 &#47;&#47;success function for get_product_id 
 function successFunction(data, quant, orderId) { 

     var productId =  data[0]&#46;_id; 
     console&#46;log("product ID = " + productId); 
     &#47;&#47; now we have the orderid and product id we can write the lineItem to the collection 
     add_order_item&#46;execute({ 
         data: { 
             "ItemId": {'collName': 'ProductItems', '_id': productId}, 
             "Quantity": quant, 
             "OrderId" : {'collName': 'Orders', '_id': orderId } 
         }, 
         success: function(data) { 
             console&#46;log("Line Item written successfully");    
         } 
     }); 
 } 

 var getProduct = function(quantity, item, orderId) { 
     get_product_id&#46;execute({ 
         data: { 
             "where": '{"ItemName":"' + item + '"}' 
         }, 
         success: function(data) { 
             &#47;&#47;variables in here remember there value even after looping 
             successFunction(data, quantity, orderId); 
         } 
     }); 
 }; 

 &#47;&#47; now need to add the order items 
 var item; 
 var quantity; 
 for (i = 1; i < shoppingBasket&#46;length; i++) { 

     item = shoppingBasket[i][0]; 
     quantity = shoppingBasket[i][1]; 
     console&#46;log("item = " + item); 
     console&#46;log("quantity = " + quantity); 

     &#47;&#47;get product data 
     getProduct(quantity, item, orderId); 
 } 

}
/pre


jquery asynchronous events issue

Posted: Tue Jul 22, 2014 2:24 pm
by Evgene Karachevtsev

Hello Terry,

Thank you for update!