Skip to main content

Template Replacements

  • 5 minutes to read

When you create a template, you often need to only extend the base control functionality.
Use the ASPxGridViewTemplateReplacement control to customize the edit form and pager bar with the following basic controls:

  • Edit cells
  • Update and Cancel buttons
  • Pager

The ASPxGridViewTemplateReplacement control allows you to include template replacements in your template while maintaining the grid’s base functionality.

Template replacements are displayed as basic controls within a grid according to style settings defined at the control level (the ASPxGridView.Styles, ASPxGridView.StylesEditors, and ASPxGridView.StylesPager properties). The ASPxGridViewTemplateReplacement.ReplacementType property specifies the controls that are displayed by the ASPxGridViewTemplateReplacement control.

See the following online demo for an example on how to use template replacements:
Run Demo: Grid Editing - Edit Form Templates.

 

The table below contains a list of the ReplacementType property values that define a template type and controls.

ReplacementType property value Template type Contained controls
EditFormContent GridViewTemplates.EditForm Edit form‘s entire contents (edit cells and buttons)
EditFormEditors GridViewTemplates.EditForm Edit cell of each field within a grid
EditFormCellEditor GridViewTemplates.EditForm Edit cell
EditFormUpdateButton GridViewTemplates.EditForm Update button
EditFormCancelButton GridViewTemplates.EditForm Cancel button
Pager GridViewTemplates.PagerBar Pager

Edit form template replacements

An edit form template replacement allows you to add controls (edit cells, Update and Cancel buttons, or pager) to an edit form template. Note that the edit cells created by the ASPxGridViewTemplateReplacement control are automatically validated on the client if their validation settings are defined at the column level.

 

  • Edit form’s entire content template replacement

    Set the ASPxGridViewTemplateReplacement.ReplacementType property to GridViewTemplateReplacementType.EditFormContent to display edit cells for every grid field with Upgrade and Cancel buttons in an edit form. Note that you cannot use a template replacement of this type if the ReplacementType of another object from this template is set to EditFormEditors or EditFormCellEditor.

     

    The code sample below demonstrates how you can extend the functionality of a regular edit form by adding an ASPxMemo control. Note that style settings and the functionality of regular controls are saved completely.

    <EditForm>
         <div style="padding: 4px">
                   <dx:ASPxGridViewTemplateReplacement ID="TemplateReplacementContent" ReplacementType="EditFormContent" runat="server">
                   </dx:ASPxGridViewTemplateReplacement>
                   <br/>
                   <dx:ASPxMemo ID="ASPxMemo1" runat="server" Height="70px" Width="100%" Text='<%# Eval("Notes")%>'>
                   </dx:ASPxMemo> 
         </div>   
    </EditForm>
    

    The image below shows the result.

    ASPxGridView - EditFormContent

    Note

    It is recommended that you use the ASPxGridViewEditingSettings.Mode property set to GridViewEditingMode.EditFormAndDisplayRow instead of the edit form template, unless you add extra controls to it while the replacement type is set to EditFormContent.

     

  • Template replacement of every edit cell

    Set the ASPxGridViewTemplateReplacement.ReplacementType property to GridViewTemplateReplacementType.EditFormEditors to display edit cells for every grid field within an edit form without Update or Cancel buttons (or if you place buttons in a custom position).

Note that you cannot use a template replacement of this type if the ReplacementType of another object from this template is set to EditFormContent* or **EditFormCellEditor.

&nbsp;

The code sample below demonstrates how you can add ASPxPageControl to an edit form. Note that style settings and the functionality of regular controls are saved completely. The entire sample is available in the **Grid Editing &#0045; Edit Form Template** of the **ASPxGridView** demo.

[!include[ASPxGridView_TemplateReplacementEditors](~/examples/aspxgridview_templatereplacementeditors2633.md)]

The image below shows the result.

![ASPxGridView - EditFormEditors](~/images/aspxgridview-editformeditors13249.png)

Refer to the following Support Center examples for information on how to use this template replacement type:

Pager template replacement

Set the ASPxGridViewTemplateReplacement.ReplacementType property to GridViewTemplateReplacementType.Pager to add a pager to the template. Note that you can use this type of template replacement within the GridViewTemplates.PagerBar template only.

 

<PagerBar>
     <table>
          <tr>
               <td>
                    <dx:ASPxGridViewTemplateReplacement ID="ASPxGridViewTemplatePager" ReplacementType="Pager" runat="server">
                    </dx:ASPxGridViewTemplateReplacement>                             
               </td>

          ...

          </tr>
     </table>
</PagerBar>

ASPxGrigView_PagerTemplateReplacement

Refer to the following Support Center example for information on how to use this template replacement type: How to embed export buttons in the ASPxGridView pager.

See Also