Quantcast
Channel: DevExpress Support Center (Examples)
Viewing all articles
Browse latest Browse all 7205

How to apply a Bootstrap Form (form-control, btn, etc.) style to the DevExpress editors in Native mode

$
0
0
This example illustrates how to enable the Native rendering mode (by setting the Native property to True) in order to produce the raw HTML elements and apply the Bootstrap Form (form-control, btn, etc.) style.
There is also a side-by-side comparison with the same set if editors in the DevExprss Moderno theme (applied in the Web.config) that has a similar color schema as the Bootstrap.

The main requirement is to set the editor's Native property in order to produce the raw HTML rendering and apply the Bootstrap style via the CssClass property:

[ASPx]
<dx:ASPxTextBox...Native="true"CssClass="form-control"></dx:ASPxTextBox><dx:ASPxMemo...Native="true"CssClass="form-control"></dx:ASPxMemo><dx:ASPxButton...Native="true"CssClass="btn btn-primary"></dx:ASPxButton>

Optionally, it may be necessary to specify the editor's Width and Height dimensions (in percent or pixels) in order to achieve a consistent/custom layout.

MVC Version:
How to apply a Bootstrap Form (form-control, btn, etc.) style to the DevExpress editors in Native mode

Viewing all articles
Browse latest Browse all 7205

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>