With the ShoppingCartQuickEntryControl, shoppers can add Items directly to the Shopping Cart. It sends real-time queries to the server using AJAX to optimize performance and the shopper's experience. 

It can be used as an alternative to the CatalogItemQuickOrderEntry control. 

See the example of the ShoppingCartQuickEntryControl in use:

When the shopper inputs an Item's stock code, SKU, an alternative part number,  or name into the designated field, CyberStore provides them with a list of Items that best match their entry.

Within this list of search results, the shopper can adjust the quantities of any Items they want to purchase. They must simply type their desired quantity in the blank field and click outside of that box when finished. They can also remove Cart selections by clicking the Del button.

To complete the quantity adjustment, the shopper must click the Add to Cart button. If the selection is successful, the shopper can see the recently added Items as well as the new subtotal for the order within the Cart.

To check out or to make additional changes to the selected Items, the shopper should visit the Shopping Cart page and proceed as normal.

By changing the values of the control's properties in the SitePages.config file for your Site, you can enable or disable certain behaviors, set certain defaults, alter aspects of the display or otherwise cusomtize your site's implementaion of the control.

The following describes properties pertaining to key functional areas of the control that can be configured to suit your needs.

Lookup Filter Properties

Item search functionality can be configured using several of the control's properties:

By default, the control allows for searching available Items. When use of the control would prefer disabling of the search functionality altogether, set the EnableStockCodeFilter property to false.

To define the scope and experience of the shopper's search, use the StockCodeFilterMode property. Take care to use only the values described below:

Use the StockCodeFilterMinimumLength property to establish the number of characters that a user must type in the stock code box before any search results appear.

A delay can be specified that determines how long (in milliseconds) after a user stops typing and the minimum filter number characters have been typed before the search results appear. Use the StockCodeFilterDelay property to set this delay. 

Item search results can be configured to show a specified number of search result rows at a time using the StockCodeFilterDropDownLength property.

To provide the shopper with the most flexibility, you can use the EnableFilterModeSelection property and use the value of true, the control will present the user with a radio selection that lets them choose between the "Exact" and "Contains" or "StartsWith" stock code filter mode. The default value is false. When the shopper first loads a page with the control present, the initial mode selection will be set the value of the StockCodeFilterMode, and if the value is set to "Exact" the search option will only be available as a "Contains" search.

Inventory Lookup Properties 

When the EnableOnHandQuantityDisplay property is set to true (default), the shopper can click the Check Stock button to view the total available quantity of that Item. The returned text is based on the configuration in the "Quantity Settings" under the Catalog Configuration tab.

Individual Item quantity messages can be set to override the Site Manager's quantity settings in the "Messages" tab in Item Maintenance.

Both the site and Item settings for quantity messages may be set using either the LimitedAvailableMessage and LimitedUnavailableMessage properties when an Item is of a limited quanitity or the UnlimitedAvailableMessage and UnlimitedUnavailableMessage properties when it is of an unlimited quantity.

Display Properties

The ShowByWarehouse property allows for one to configure the ability to show or hide quanty subtotals by warehouse. The default is to use the value specified by the "Display Quanty Subtotals by Warehouse" setting in the Site Manager > Catalog Configuration screen found in the Quantity Settings tab.

When displaying quantity subtotals by warehouse, the WarehouseQuantityMessage property allows for customizing the HTML code used to render each row of the warehouse listing.

Text Properties

Default text used as hint labels within the quantity and stock input boxes before a user types can be set using the QuantityEmptyHintText and StockCodeEmptyHintText properties.

The text for the Add to Cart and Check Stock buttons can be customized with the AddToCartButtonText and CheckStockButtonText properties.

Properties Inherited from the Base CyberStoreBaseControl

Properties specific to the CyberStoreBaseControl can be listed in the following categories:

• Override Properties
• Contextual Properties

Override Properties

When the IgnoreControl property is set to true, all processing of a control is skipped, and the control's Visible property is set to false ensuring that it is not rendered in the resulting CyberStore page.

Contextual Properties

Contextual properties define specific details about the current instance of the control based on context. Context can be set by any number of factors including the log in state of the Shopper, the Site being visited, or the properties that have been established for a control.

The AttributesBag property is used internal to control processing and is the collection of attributes, or properties, and their values based on how the control is configured. The attributes in this property are set by processing the SitePages.config file as well as any specific declared property values in any registered sub controls. It allows for the passing down of all properties to a control and any registered sub controls.

The ComConfig, UserData and Site_ID properties are read-only values made available to all CyberStore controls to aid in processing and establishing context about the Site and Shopper.

Configurable CSS Class Names 

The following list of properties can be used to specify CSS class name overrides of certain elements in the ShoppingCartQuickEntryControl:

Pre-Defined CSS Class Names 

Several CSS classes are rendered by the control to present and format the layout of the HTML output. By default, the base styling for these classes can be found in the CyberStore's global.css file in the application's /Ecommerce/css/ folder.

Quick Entry Cart Subtotal Area

The output of the Shopping Cart subtotal, as calculated when items or quantities are added or adjusted, produces HTMl content that will include references to the following pre-defined CSS classes.

Quick Entry Input Area

The input area produces HTML content that will include references to the following pre-defined CSS classes.

Quick Entry Shopping Cart Contents Area 

The output of the Shopping Cart lines displayed produces HTML that will include references to the following pre-defined CSS classes.

The following is the markup for this control.

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ShoppingCartQuickEntryControl.ascx.cs" Inherits="Dovetail.Ecommerce.Controls.ShoppingCartQuickEntryControl" %>
<div id="QEShoppingCartSubtotalWrapper" class="QE-ShoppingCartSubtotal-Wrapper">
</div>
<style>
.qoe-fixer { padding: 1px 1px 2px 1px!important; border-radius: 0px!important; }
</style>
<dx:ASPxPanel ID="QEInputPanel" runat="server" ClientIDMode="Static" DefaultButton="btnAddToCart" CssClass="QE-Input-Panel">
    <PanelCollection>
        <dx:PanelContent runat="server">
            <div class="QE-Input-Wrapper">
                <div class="QE-StockCodeInput">
                    <dx:ASPxRadioButtonList ID="rdoSearchType" runat="server" ClientIDMode="Static" RepeatDirection="Horizontal" Border-BorderStyle="None" CssClass="QE-SearchTypeBox" >
                        <Items>
                            <dx:ListEditItem Value="Exact" Text="Exact" />
                            <dx:ListEditItem Value="Search" Text="Search" />
                        </Items>
                        <ClientSideEvents SelectedIndexChanged="
                            function(s,e) {
                                if(s.GetSelectedIndex() == 0) { 
                                    cmbStockCode.SetVisible(false);
                                    cmbStockCode.SetText('');
                                    txtStockCode.SetVisible(true);
                                }
                                else {
                                    txtStockCode.SetVisible(false);
                                    txtStockCode.SetText('');
                                    cmbStockCode.SetVisible(true);
                                }
                                toggleFocuser();
                                focuser.Focus();
                            }" />
                    </dx:ASPxRadioButtonList>
                    <br />
                    <dx:ASPxComboBox ID="cmbStockCode" runat="server" ClientIDMode="Static"
                        AnimationType="Auto" DropDownStyle="DropDownList" TextField="StockCode" ValueField="Item_ID" TextFormatString="{0} - {1}"
                        EnableCallbackMode="true" ValueType="System.Int32" AllowMouseWheel="true" OnInit="cmbStockCode_Init"
                        DropDownButton-Visible="false" Width="300" DropDownWidth="600" Height="30" Paddings-Padding="4"
                        DisabledStyle-Border-BorderStyle="None" DisabledStyle-ForeColor="Black"
                        DisabledStyle-BackColor="Transparent" DisabledStyle-BackgroundImage-ImageUrl="nothing.gif"
                        DisabledStyle-Cursor="default" AutoPostBack="false">
                        <Columns>
                            <dx:ListBoxColumn FieldName="StockCode" Width="100px" />
                            <dx:ListBoxColumn FieldName="Name" Width="150px" />
                        </Columns>
                    </dx:ASPxComboBox>
                    <dx:ASPxTextBox ID="txtStockCode" runat="server" ClientIDMode="Static" ClientInstanceName="txtStockCode" Width="300" AutoCompleteType="Disabled" />
                    
                </div>
                <div class="QE-ClearText">
                    <dx:ASPxButton ID="btnClearStockCode" ClientIDMode="Static" runat="server" AutoPostBack="false" />
                </div>
                <div class="QE-QtyInput col-xs-3">
                    <dx:ASPxTextBox ID="txtStockCodeQuantity" runat="server" ClientIDMode="Static" />
                </div>
                <div class="QE-AddToCartInput">
                    <dx:ASPxButton ID="btnAddToCart" runat="server" ClientIDMode="Static" AutoPostBack="false" class="DT-Button"/>
                </div>
                <div class="QE-AddToCartSpinner">
                    <img height="32" width="32" id="QEAnimatedSpinner" src='<%= AnimatedLoadingGif %>' style="display: none;" />
                </div>
            </div>
        </dx:PanelContent>
    </PanelCollection>
</dx:ASPxPanel>
<br />
<div id="QEShoppingCartMessaging" runat="server"></div>
<dx:ASPxButton ID="btnCheckout" runat="server" Text="Checkout" Visible="false" OnClick="btnCheckout_Click" />
<div id="QEShoppingCartContents">
</div>
<asp:HiddenField ID="hfLeadTimeMessage" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfEnableOnHandQuantityDisplay" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfEnableLeadTimeMessage" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfLimitedAvailableMessage" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfLimitedUnavailableMessage" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfUnlimitedAvailableMessage" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfUnlimitedUnavailableMessage" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfCheckStockButtonText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfShowColumnHeader" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfStockCodeColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfDescriptionColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfQuantityColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfDefaultPriceColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfCustomerPriceColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfExtPriceColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfOnHandQuantityColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfDiscountPriceColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfWebPriceColumnHeaderText" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfUnitPriceColumnHeaderText" ClientIDMode="Static" runat="server" />

System.Object
   System.Web.UI.Control
      System.Web.UI.TemplateControl
         System.Web.UI.UserControl
            Dovetail.Ecommerce.ControlBases.CyberStoreBaseControl
               Dovetail.Ecommerce.Controls.ShoppingCartQuickEntryControl

Reference

ShoppingCartQuickEntryControl Members
Dovetail.Ecommerce.Controls Namespace

Version 2.13 New Features

Optimized Shopping Cart Line Entry with ShoppingCartQuickEntryControl