Custom Cart Step - Part 1

0
Comments
1
Votes
Login to vote

When setting up a checkout process for your Kentico ecommerce solution, the "Generate default process" button will create a common checkout experience. There are times, however, when you need to collect additional data during this process but you want to leave the default processes as intact as possible. In this post, I’ll explain how you can add a step and carry that data through to the order creation.

To generate the default checkout process, navigate to CMS Desk>Tools>E-commerce>Configuration>Store Settings >Checkout Process> “Generate default process” button.

After you’ve generated the default process, the first thing you will need to do is create a new step. It’s become common practice for our development team to create a folder named Extensions at the root of the Kentico web site project to house any extensions or modifications to the standard Kentico functionality. In the Extensions folder, we’ll mirror the location of the default cart steps and create a new user control in /Extensions/CMSModules/Ecommerce/Controls/ShoppingCart. In this example we’ll call our control “GatherCustomInformation.ascx”. You’ll need to go into the code behind of this control and change its inherited type from “System.Web.UI.UserControl” to “ShoppingCartStep”, adding a reference to CMS.EcommerceProvider.

using CMS.EcommerceProvider;

public partial class Extensions_CMSModules_Ecommerce_Controls_ShoppingCart_GatherAdditionalInformation : ShoppingCartStep
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }
}

Now we’ll add a text box to the markup to gather some custom info. We’ll also add a Label to display any errors we run into.

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="GatherCustomInformation.ascx.cs" Inherits="Extensions_CMSModules_Ecommerce_Controls_ShoppingCart_GatherCustomInformation" %>

<asp:Label ID="lblError" runat="server" CssClass="ErrorLabel" EnableViewState="false" Visible="false" />
<div class="customInfo">
    <asp:Label id="lblCustomInfo" AssociatedControlID="txtCustomInfo" runat="server" Text="Some Custom Info:" />
    <asp:TextBox id='txtCustomInfo' runat="server" />
</div>

You’ll also need to register this step in the CMS. Navigate to CMS Desk>Tools>E-commerce>Configuration>Store Settings >Checkout Process >”New Step”. Here’s our sample.

CreateStep.PNG

You can then use the arrows on the Checkout process tab to move the step to where you want it in the checkout process. More information can be found here:
http://www.kentico.com/docs/ecommerceguide/index.html?purchase_process_overview.htm

It’s likely that you’ll want to gather the custom information early in the checkout process but not want to save it until you’ve created the order. Adding this information to the standard ViewState doesn’t work because the ViewState isn’t preserved when stepping through the cart. To get around this, Kentico has added the SetTempValue(string key, object value) and GetTempValue(string key) methods to the ShoppingCartControl object, which is available because we are inheriting from ShoppingCartStep.

We’ll want to override the ProcessStep() method to store this information. We’ll add the following:

public override bool ProcessStep()
{
    try
    {
        if (txtCustomInfo != null && txtCustomInfo.Text != String.Empty)
        {
            this.ShoppingCartControl.SetTempValue("CustomInfo", txtCustomInfo.Text);
        }
        return true;
    }
    catch (Exception ex)
    {
        lblError.Visible = true;
        lblError.Text = ex.Message;
        return false;
    }
}

If the user decides to change some information and steps back, we need to make sure that the information is populated with what they had previously entered. We’ll add this to the Page_Load event:

protected void Page_Load(object sender, EventArgs e)
{
    if(this.ShoppingCartControl.GetTempValue("CustomInfo") != null)
    {
        txtCustomInfo.Text = (string)this.ShoppingCartControl.GetTempValue("CustomInfo");
    }
} 

You’re code behind file should now look something like this:

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using CMS.EcommerceProvider;

public partial class Extensions_CMSModules_Ecommerce_Controls_ShoppingCart_GatherCustomInformation : ShoppingCartStep
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if(this.ShoppingCartControl.GetTempValue("CustomInfo") != null)
        {
            txtCustomInfo.Text = (string)this.ShoppingCartControl.GetTempValue("CustomInfo");
        }
    }

    public override bool ProcessStep()
    {
        try
        {
            if (txtCustomInfo != null && txtCustomInfo.Text != String.Empty)
            {
                this.ShoppingCartControl.SetTempValue("CustomInfo", txtCustomInfo.Text);
            }
            return true;
        }
        catch (Exception ex)
        {
            lblError.Visible = true;
            lblError.Text = ex.Message;
            return false;
        }
    }
}

In the next post, I will go over saving this data to the order.

 
Posted by Darold "Boomer" Thunder on 12/7/2010 4:16:00 PM
Filed under: ecommerce
  
Comments
Blog post currently doesn't have any comments.