The page a a dataset and repeat region pre-applied that selects only records from the database table that have the "HasColorChoice" field set to true.
Begin the modifications to this page by adding a cart control as described in the previous sections, set the carts properties as outlined below:
ID = Cart1
IsShopForMoreTarget = true (check the box)
OnAddedToCartURL = ../cart/cart.aspx (browse and select)
Then before closing the dialog navigate to the "Custom Fields" section of the dialog and define a Color field as shown in the following image:
Now click the "OK" button and the cart tag will be inserted into the page.
Next place your cursor in the empty cell to the right of the cell containing the text "Quantity:" and insert an "Add To Cart FormField"
and the following dialog will appear:
Define the properties as shown in the dialog image:
| FieldName = Quantity (select it from the dropdown box)
|
| FieldType = text
|
| size = 3
|
| CssClass = TextBox2
|
|
|
| FieldName = ID
|
| FieldType = hidden
|
| FieldValue = <%# DataSet1.FieldValue("PartNo", Container) %>
|
|
|
| FieldName = RawCost
|
| FieldType = hidden
|
| FieldValue = <%# DataSet1.FieldValue("Price", Container) %>
|
|
|
| FieldName = Description
|
| FieldType = hidden
|
| FieldValue = <%# DataSet1.FieldValue("Description", Container) %>
|
Then place your cursor in the empty table cell to the right of the cell containing the text "Colour:" and insert another Add To Cart FormField, the property values for this one are:
| FieldName = Color
|
| FieldType = DropDownBox
|
| FirstItemText = Select Color
|
| CssClass = DropBox
|
| DataSource = <%# GetColors(DataSet1.FieldValue("ProductID", Container)) %>
|
| DataTextField = Color
|
| DataValueField = Color
|
|
|
One final thing we need to do on this page before it can be used is define the GetColors method that is used as the Datasource for the color picker dropdown box, place the following code block in the page:
| C#
|
| <script runat="server">
|
| System.Data.DataView GetColors(string ProductID)
|
| {
|
| return new System.Data.DataView(DsColors.DefaultView.Table,
|
| "ProductID=" + ProductID,
|
| "Color",
|
| System.Data.DataViewRowState.CurrentRows);
|
| }
|
| </script>
|
|
|
| VB
|
| <script runat="server">
|
| Function GetColors(ProductID As String) As System.Data.DataView
|
| Return New System.Data.DataView(DsColors.DefaultView.Table, _
|
| "ProductID=" & ProductID, _
|
| "Color", _
|
| System.Data.DataViewRowState.CurrentRows)
|
| End Function
|
| </script>
|
This will return filtered DataView objects from the DsColors dataset that have been filtered by the appropriate ProductID and sorted by the Color field, these are then bound to the appropriate color picker dropdown boxes.
This page is finished now, save and close it and then make the following changes to the following pages:
cart/cart.aspx
| · | Add the custom "Color" field to this pages cart control.
|
| · | Add a column in cart display table for displaying the Color value and drag the Color field from the Bindings panel into the new column.
|
cart/summery.aspx
| · | Add the custom "Color" field to this pages cart control.
|
| · | Add a column in cart display table for displaying the Color value and drag the Color field from the Bindings panel into the new column.
|
cart/finish.aspx
| · | Add the custom "Color" field to this pages cart control.
|
cart/invoice_template.htm
| · | Add a column in table for displaying the Color value and define the placeholder in the same manner as the other text based field placeholders.
|