Working with the Credit Cards Web Part
The Credit Cards Web Part shows all the credit card profile records associated with the current shopper. There are no filtering or paging options for this list as it is not expected to be lengthy. Each record in the list has a label to show if the credit card is the default payment (a shopper can have only one default payment entry), and a link to edit the credit card information is available that takes the shopper to an edit page. There is also a link to remove a saved credit card record, with the shopper prompted with a confirmation message before deleting the credit card (this is optional; shoppers can set a property to confirm deletion or not). A shopper can add a new credit card record by clicking on the Add New Credit Card button that navigates the shopper to the Credit Card Detail Web Part in Add mode.
Architecture
The Credit Cards Web Part contains the following components:
CreditCardListWebPart. Dynamically loads the CreditCardList user control.
ReadOnlyCreditCardDetail.ascx. Displays the properties of the credit card in read-only mode.
CreditCardList.ascx. Displays the shopper's list of credit cards and provides a means to conduct actions on the cards. Card information such as a partial card number, card type, and first line of the billing address display in labels. Actions are provided to create, edit, or remove a card. The partial card number displayed is the CreditCard object property CreditCardIdentifier.
Properties
The following table lists and describes the properties for the Credit Cards Web Part.
Property |
Maps to |
Type |
Description |
Default |
|---|---|---|---|---|
"Action" URL parameter |
ActionQueryParameter |
String |
Sets the name of the "action" parameter to use when creating URL queries to the "credit card detail" page. This setting must specify the same name expected by the destination page. |
act |
Display "Back" button |
AllowBackUrlButton |
Boolean |
If checked, a "back" button is displayed which lets the user return to a previous page. |
False |
"Billing address" section title text |
BillingAddressHeaderLabelText |
String |
Sets the text displayed above the "billing address" section. |
ProfileResources.CreditCardListBillingAddressHeaderLabelText |
"Add new credit card" button text |
ButtonAddNewCreditCardText |
String |
Sets the text displayed on the "add new credit card" button. |
Add Credit Card |
"Back" button text |
ButtonBackText |
String |
Sets the text displayed on the "back" button. |
Back to |
"Edit" button text |
ButtonEditText |
String |
Sets the text displayed on the "edit" button |
Edit |
"Remove" button text |
ButtonRemoveText |
String |
Sets the text displayed on the "remove" button. |
Delete |
"Credit card number" column header text |
CCNumberHeaderLabelText |
String |
Sets the text displayed at the top of the "credit card number" column. |
Number |
"Credit card type" column header text |
CCTypeHeaderLabelText |
String |
Sets the text displayed at the top of the "credit card type" column. |
Type |
Use "delete confirmation" pop-up |
ConfirmDeletion |
Boolean |
If checked, causes a pop-up to be displayed asking the user to confirm the deletion. You can configure the text displayed using the ' "Delete confirmation" pop-up text' field. |
True |
"Credit Card Detail" page URL |
CreditCardDetailUrl |
String |
Sets the page URL to redirect to in order to view or edit credit card details. |
ProfileResources.CreditCardDetailUrl |
"Credit card id" URL parameter |
CreditCardIdQueryParameter |
String |
Sets the name of the "card id" parameter to use when creating URL queries to the "credit card detail" page. This setting must specify the same name expected by the destination page. |
card |
"Credit card list" section title text |
CreditCardListHeader |
String |
Sets the text displayed before the "credit card list" |
My Credit Cards |
CSS class |
CssClass |
String |
Sets the style sheet "class" name used when outputting the HTML markup of this web part. |
Blank |
"Default credit card" label text |
DefaultCreditCardLabelText |
String |
Sets the text displayed on the credit card profile to indicate that it is the "default credit card". |
Default Credit Card |
"Delete confirmation" pop-up text |
DeleteConfirmationMessage |
String |
Sets the text displayed on the delete confirmation pop-up. |
Confirm Credit Card Deletion |
Instructional text |
InstructionText |
String |
Sets the text displayed above the credit card section. Can be used to provide instructions to end users. |
Add a new credit card to your account below. |
"Remove" link button image Url |
RemoveLinkButtonImageUrl |
String |
Sets the URL of the image to use as a "remove" button. |
Blank |
Customization
You can customize the Credit Cards Web Part by modifying the ASCX file.
.gif "Important note") Important Note: |
|---|
If you make modifications to the ASCX file to customize a Web Part, rename the modified ASCX file to avoid the risk of overwriting your Web Part customizations during an upgrade. |
Error Handling
There is no design-time error handing required for this Web Part.
API Dependencies
The Credit Cards Web Part uses the CreditCards relationship of the UserProfile object. It retrieves the user profile by using Query<UserProfile>. Billing addresses are related to a credit card and are retrieved by using QueryRelatedItem<Address> using the ModelSearch criteria.
You can use the strongly typed members CreditCardIdentifier, ID, and CreditCardType of the CreditCard object as well as the Line1 member of Address.
See Also
Other Resources
Developing with SharePoint Commerce Services