Hi Rehan,

Well, first of all, pick your datepicker module. jQuery UI have a good one.

Add the picker to your html and then go to the teaCommerce_Advanced.js. Find the jQuery('#cart.stepProgress4 #cartBottom input#next').live("click", function () { line, which is where the page is submitted to the payment gateway. In vanila starter kit it placed around line 433.

Now you will need to:
1. Retrieve the chosen date from the date picker
2. call the TeaCommerce.updateOrderProperty() method, to send the date to the order.

You will probably want to make the call asyncronously and when the success response comes back you call the goToPaymentmethod. Something like this:

TeaCommerce.updateOrderProperty('date', dateValue, {successfn: function(){
  TeaCommerce.goToPayment();
}});

Hope that helps.

/Rune

yes this help, but i need to add on OrderLineProperty and not OrderProperty...:)

perfect... thx...

one last question how do i add javascript to xslt...? hehe :)

This might be the solutions if you can't just write it into the xslt:

http://www.sharepointboris.net/2009/03/inserting-javascript-into-xslt/

But inline javascript is normally something you should limit to an absolute minimum :)

/Rune

i figure it out... and it works... thx for your help...

Sweet. Another checkmark to the collection ;)

/Rune

Hi Rune,

i have followed your instruction but i am receiving an annoying error, and my date would not be added.. below is my code

var orderline = TeaCommerce.getOrder();
    for (var i = 0; i < TeaCommerce.getOrder().OrderLines.length; i++) {

        if (TeaCommerce.getOrder().OrderLines[0].Properties[3].Value == "Baker") {

            var formObjDate = {
                "DeliveryDate": jQuery('#datepickerBaker').val(),
                "DeliveryTime": jQuery('#datepickerBaker').val()
            };
        }

        else {

            var formObjDate = {
                "DeliveryDate": jQuery('#datepickerOther').val(),
                "DeliveryTime": jQuery('#datepickerOther').val()
            };
        }

        TeaCommerce.updateUniqueOrderLineProperties(TeaCommerce.getOrder().OrderLines[i].Id, formObjDate);
    }

    window.location.href = jQuery(this).attr('link');
    return false;

This what is included in my method TeaCommerce.updateUniqueOrderLineProperties(452, formObjDate);
I have followed this TeaCommerce.updateUniqueOrderLineProperties(orderLineId, propertyList, settings) 

I have also tried this TeaCommerce.updateUniqueOrderLineProperties(TeaCommerce.getOrder().OrderLines[i].NodeId, TeaCommerce.getOrder().OrderLines[i].Id, formObjDate, false);

And i am receiving this error, what i am doing wrong...?

Well there's a bunch of stuff wrong there :)

1. Don't call getOrder that many times. It will make a server call and fetch the order from the server. It's fast, but not that fast.
2. Write the "Baker" property into your html as an attribute on your orderline tr. Just like the order line id is.
3. Actually you don't need to call get order at all! Instead get the order lines directly from the DOM. Something ilke this:

var orderLines = jQuery('#cartContent .orderLine'),
     dateBaker = jQuery('#datepickerBaker').val(),
     date = jQuery('#datepickerOther).val();
orderLines.each(function(){
  var orderLine = jQuery(this),
      orderLineId = orderLine.attr('orderlineid'),
       isBaker = orderLine.attr('baker') == "Baker";

        if (isBaker) {

            var formObjDate = {
                "DeliveryDate": dateBaker,
                "DeliveryTime": dateBaker
            };
        }

        else {

            var formObjDate = {
                "DeliveryDate": date,
                "DeliveryTime": date
            };
        }

  TeaCommerce.updateUniqueOrderLineProperties(orderLineId, 'date');
});

Don't know if this is precise, but you will need to do something like that. Please use firebugs console to check what is actually sent to the server. That way you can see if it does what you want to.

/Rune

is working on a reply...