Сохранение встроенных элементов управления DevExpress в веб-формах ASP.NET

Question

Я только что заменил элементы управления Telerik в небольшом веб-проекте на элементы управления DevExpress, но теперь, несмотря на то, что я добавил встроенный div отображения в виде контейнера, эти элементы управления больше не отображаются как встроенные.Что могло вызвать это, и что я могу сделать, чтобы вернуть эти ошибочные элементы управления обратно в строку?

<div style="display: inline;">
    <label>
        Department:</label>
    <dx:ASPxComboBox ID="deptCombo" runat="server" AutoPostBack="false" ValueField="DeptId" TextField="DeptName" Width="250px" OnSelectedIndexChanged="deptCombo_SelectedIndexChanged">
    </dx:ASPxComboBox>
    <label>
        Production Date:</label>
    <dx:ASPxDateEdit ID="productionDatePicker" runat="server" DisplayFormatString="{0:dd/MM/yyyy}" EditFormat="Custom" EditFormatString="dd/MM/yyyy" 
        ondatechanged="productionDatePicker_DateChanged">
    </dx:ASPxDateEdit>
</div>

Answer 1

Почти все элементы управления DevExpress отображаются в виде таблиц. Основным преимуществом этого подхода является то, что этот способ обеспечивает хорошие возможности кросс-браузерности, поскольку при использовании вложенных элементов div может быть сложно синхронизировать их позиции и размеры для всех браузеров. Однако использование таблиц позволяет конечным пользователям избавиться от этой проблемы.

[CSS] добавьте эту строку в ваш css

.DXControlsInline {display: inline-table;}

[ASPx] add CssClass = "DXControlsInline" для элементов управления, которые вы хотите сделать встроенными

<dx:ASPxLabel ID="ckArboviralDiseaseChikungunyaOtherSpecify" runat="server"  CssClass="DXControlsInline" Text="Specify:"></dx:ASPxLabel>
<dx:ASPxTextBox ID="tbArboviralDiseaseChikungunyaOther" CssClass="DXControlsInline"  ClientInstanceName="tbArboviralDiseaseChikungunyaOther" runat="server" Width="350px"></dx:ASPxTextBox> 

Источник: http://www.theedgesearch.com/2016/04/how-to-arrange-devexpress-controls.html

Answer 2

Похоже, что элементы управления DevX имеют некоторый CSS, который вам нужно переопределить.

Для начала, я бы попробовал добавить флаг! Важный к стилю:

<div style="display: inline !important;">

Если это не сработает, переключитесь обратно на RadControls. Они намного превосходят :) 1006 *

Answer 3

Задача не имеет прямого отношения к нашим элементам управления и может быть реализована без них аналогичным образом.В случае ASPxTextBox определите для него свойство CssClass со следующим правилом:

<dx:ASPxTextBox ID="txt1" runat="server" Width="170px" CssClass="txtStyle"></dx:ASPxTextBox>

.txtStyle {
    display: inline-block;
}

Я подготовил небольшой пример, чтобы продемонстрировать, как это работает.См. Также Свойство отображения CSS.

ОБНОВЛЕНО:

Если для ASPxTextBox указан заголовок, он отображается как таблица.Вот почему предлагаемый подход не работает в этом случае.Чтобы решить эту проблему, я предлагаю вам поместить каждое текстовое поле в элемент div и установить для него свойство display.Дайте мне знать, если это поможет.

Источник