How to: Dynamically Display the Focused Card's Values Outside the ASPxCardView

• Jul 02, 2020

The following example dynamically displays the focused employee’s card details outside the ASPxCardView.

Handle the ASPxClientCardView.FocusedCardChanged event to call the OnFocusedCardChanged() function. This function queries the server to return the employee’s details. The returned array is passed to the OnGetRowValues() function that specifies values for corresponding HTML elements.

The image below shows the result:

JS

function OnFocusedCardChanged() {
    cardView.GetCardValues(cardView.GetFocusedCardIndex(), 'FirstName;LastName;HomePhone;Title;Notes', OnGetCardValues);
}
function OnGetCardValues(values) {
    var editors = [FirstName, LastName, Phone, Title, Notes];
    for (var i = 0; i < editors.length; i++) {
        var editor = editors[i];
        editor.SetValue(values[i]);
    }
}