#c# #javascript #combobox #ext.net
#c# #javascript #выпадающий список #ext.net
Вопрос:
Невозможно сохранить выбранный цвет фона внутри панели сетки после перехода к следующей строке .. он отлично работает за пределами панели.Я хочу сохранить выбранный цвет фона в выпадающем списке и после перехода из этой строки…
<ext:XScript ID="XScriptdd1" runat="server">
<script type="text/javascript">
var applyFilter = function(field, grid) {
var c = field.value;
if (c == '1') {
field.el.dom.style.backgroundColor = "#ff0000";
field.el.dom.style.backgroundImage = "none";
} else if (c == '2') {
field.el.dom.style.backgroundColor = "#FF8080";
field.el.dom.style.backgroundImage = "none";
} else if (c == '3') {
field.el.dom.style.backgroundColor = "Yellow";
field.el.dom.style.backgroundImage = "none";
} else if (c == '4') {
field.el.dom.style.backgroundColor = "#C2FFA3";
field.el.dom.style.backgroundImage = "none";
} else if (c == '5') {
field.el.dom.style.backgroundColor = "Green";
field.el.dom.style.backgroundImage = "none";
} else if (c == '6') {
field.el.dom.style.backgroundColor = "Gray";
field.el.dom.style.backgroundImage = "none";
} else {
field.el.dom.style.backgroundColor = "white";
field.el.dom.style.backgroundImage = "none";
}
grid.focus(true);
};
</script>
</ext:XScript>
<ext:GridPanel ID="GrrdERLPnl" runat="server" EnableColumnMove="false" ButtonAlign="Center"
Border="true" TrackMouseOver="true" Height="500" Width="900" AutoScroll="true"
AutoWidth="false" Padding="20">
<Store>
<ext:Store ID="StoreERL" runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="category" Type="String" />
<ext:RecordField Name="ComboField" Type="int" />
<ext:RecordField Name="comments" Type="String" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
</Store>
<Plugins>
<ext:EditableGrid ID="EditableGrid1" runat="server" />
</Plugins>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column Header="Level 1 ERL" DataIndex="category" Width="350" Align="Center" />
<ext:Column Header="ERL Maturity" DataIndex="ComboField" Width="250" Align="Center">
<Editor>
<ext:ComboBox Flex="1" runat="server" ID="cmboErlMaturity" NoteAlign="Top" ItemSelector="div.search-item"
Width="150" Height="100" TriggerAction="All" >
<Items>
<ext:ListItem Text="Select Maturity " Value="0" />
<ext:ListItem Text="A " Value="1" />
<ext:ListItem Text="B " Value="2" />
<ext:ListItem Text="C " Value="3" />
<ext:ListItem Text="D " Value="4" />
<ext:ListItem Text="E " Value="5" />
<ext:ListItem Text="N/A " Value="6" />
</Items>
<Listeners>
<Select Handler="applyFilter(this,#{GrrdERLPnl})" />
<%--<Change Handler ="applyFilter(this,#{GrrdERLPnl})" />--%>
</Listeners>
<Template runat="server">
<Html>
<tpl for=".">
<div class="search-item">
<h1 style="text-align:center; background-color:{[values.value == 0 ? 'white' : values.value == 1 ? 'Red' : values.value == 3 ? 'Yellow': values.value == 2 ? '#FF8080': values.value == 4 ? '#C2FFA3': values.value == 5 ? 'Green': values.value == 6 ? 'Gray' : 'black']}">{text}</h1>
</div>
</tpl>
</Html>
</Template>
</ext:ComboBox>
</Editor>
</ext:Column>
<ext:Column Header="Comments" DataIndex="comments" Width="250" Align="Center">
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
код позади
private object[] Data
{
get
{
return new object[]
{
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Technical Requirements", 0, "Comments to test" },
new object[] { "Statemenet of Work", 0, "Comments to test1" }
};
}
}
private void BindData()
{
var store = this.GrrdERLPnl.GetStore();
store.DataSource = this.Data;
store.DataBind();
}
Как только мы установим фокус на сетке с помощью grid.focus (true);
Он отлично работает в FF и Chrome, но в IE8 появляется ошибка js: «Объект не поддерживает это свойство или метод».
Любая помощь приветствуется заранее!
Комментарии:
1. Невозможно установить цвет фона после выбора на панели сетки … он отлично работает за пределами панели сетки… Я установил grid.focus (true), он работает нормально, но с ошибкой js «Объект не поддерживает это свойство или метод». Любая помощь приветствуется заранее!
Ответ №1:
Спорно говорить о GridPanel как о фокусируемом элементе. Я бы рекомендовал удалить эту строку:
grid.focus(true);
Что касается того факта, что цвет фона исчезает, это связано с тем, что строка панели сетки повторно отображается после редактирования. Выпадающий список также повторно отображается.
В качестве решения я могу предложить добавить этот прослушиватель afterRender для выпадающего списка:
<AfterRender Handler="applyFilter(this);" />
Комментарии:
1. , Спасибо за ваш ответ…. Его работа после вывода фокуса из выпадающего списка требует немного времени …. пробовали этот, но это было немного медленное и необычное поведение, а не приятный опыт с точки зрения пользователя. Пожалуйста, предложите, есть ли какой-либо другой обходной путь!! это мы можем попробовать…
2. Вы имеете в виду, что он работает медленно и нестабильно с этим прослушивателем afterRender? Я ничего не заметил в FireFox. Пожалуйста, уточните, с каким браузером вы тестируете?