ASPxClientUtils.ToggleClassName(element, className, toggleState) Method

Adds or removes a class name to an element.

Declaration

static ToggleClassName(
    element: any,
    className: string,
    toggleState: boolean
): void

Parameters

Name	Type	Description
element	any	The element.
className	string	The class name.
toggleState	boolean	true, to add a class name; otherwise, false.

Remarks

The following example illustrates how to add or delete a class name to a summary value element depending on the summary value.

ASPX

<dx:ASPxGridView ID="Grid" runat="server" ClientInstanceName="grid" >
    <Columns>
        //...
        <dx:GridViewDataTextColumn FieldName="Total" UnboundType="Decimal" UnboundExpression="[UnitPrice] * [Quantity] * (1 - [Discount])" />
    </Columns>
    <SettingsEditing Mode="Batch" />
    <ClientSideEvents BatchEditSummaryDisplayText="onBatchEditSummaryDisplayText" />
    <TotalSummary>
        <dx:ASPxSummaryItem FieldName="Total" SummaryType="Sum" />
    </TotalSummary>
    <GroupSummary>
        <dx:ASPxSummaryItem FieldName="Total" SummaryType="Sum" />
    </GroupSummary>
</dx:ASPxGridView>

JS

function onBatchEditSummaryDisplayText(s, e) {
    if (e.summaryFieldName === "Total") {
        var hasLargeValue = e.value > 1300000;
        ASPxClientUtils.ToggleClassName(e.summaryElement, "summaryItemLargeValue", hasLargeValue);
    }
}

CSS

.summaryItemLargeValue {
    background-color: #ffe6e6;
}