Member 14197412 Ответов: 1

Я не могу изменить цвет фона метки radgrid на основе “если выполняется условие”

i am working on radgrid in asp.net.i take label in the radgrid for display status of person.i want that if ststus is "availabe" the backgroung color of label is green and if status is "Not Availabe" then backround color is red.i try it by javascript but i am unable to access each record of the grid.


Что я уже пробовал:

<pre> <telerik:GridTemplateColumn  DataField="Editor_status" HeaderText="Editor_status" ReadOnly="true">
   <ItemTemplate>
   <asp:Label ID="Editor_status"   runat="server" Text='<%#Eval("Editor_status")%>' BackColor="SkyBlue" Font-Size="14px" CssClass= "badge badge-pill  hvr-grow  badge-success" ></asp:Label>
   </ItemTemplate>
   </telerik:GridTemplateColumn>





ява скрипт:

 <script>
   $(document).ready(function () {
        var a = document.getElementById("Editor_status").innerText
        function myFunction() {
            if (a == "Available") {
                window.alert("avlble");
            }
            else {
                window.alert("not avlble");
            }
        }
</script>


но таким образом никакого предупреждения не отображается..я слаб в javascript ,так что не обращайте внимания на мой вопрос начального уровня....вы также ответите мне в vb.net или javascript.

1 Ответов

Рейтинг:
1

Richard Deeming

Посмотрите на визуализированный HTML - код id атрибут не будет точно равен "Editor_status".

Каждый id в HTML документ должен быть уникальным. Ваша метка находится внутри элемента управления с привязкой к данным. На странице могут быть сотни копий этикетки, по одной для каждой строки вашей сетки. Итак ASP.NET автоматически превращает идентификатор на стороне сервера в уникальный идентификатор клиента при отображении страницы.

Вам нужно будет найти другой способ идентифицировать свой элемент управления из Javascript - например, добавив еще одну запись в список CssClass и используя документ.getElementsByClassName[^].

<asp:Label ID="Editor_status" runat="server" Text='<%# Eval("Editor_status") %>' BackColor="SkyBlue" Font-Size="14px" CssClass="badge badge-pill  hvr-grow  badge-success -js-editor-status" />
$(function(){
    var labels = document.getElementsByClassName("-js-editor-status");
    ...
});

Но у вас есть и другая проблема: alert находится внутри функции Javascript, которую вы никогда не вызываете. Вам нужно будет исправить это, если вы хотите, чтобы появилось предупреждение.
$(function(){
    var labels = document.getElementsByClassName("-js-editor-status");
    for (var index = 0; index < labels.length; index++) {
        var label = labels[index];
        if (label.innerText === "Available") {
            alert("Row " + index + ": Available");
        }
        else {
            alert("Row " + index + ": Not available");
        }
    }
});