I am unable to change background color of label of radgrid on the basis of “if condition”

Question

1.00/5 (1 vote)

See more:

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.

What I have tried:

<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>

java script is:

 <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>

but by this way no alert is display..i am weak in javascript ,so don't mind my initial level question....u also answer me in vb.net or javascript.

Posted 23-Apr-19 3:12am

Member 14197412

Updated 24-Apr-19 11:06am

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Answer 1 · 2019-04-24T11:07:00

Look at the rendered HTML - the id attribute is not going to be exactly equal to "Editor_status".

Every id in an HTML document needs to be unique. Your label is inside a data-bound control. There could be hundreds of copies of the label in the page, one for each row of your grid. So ASP.NET automatically turns the server-side ID into a unique client ID when it renders the page.

You'll need to find another way to identify your control from Javascript - for example, by adding another entry in the CssClass list and using document.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" />

JavaScript

$(function(){
    var labels = document.getElementsByClassName("-js-editor-status");
    ...
});

But you also have another problem: the alert is inside a Javascript function which you never call. You'll need to fix that if you want the alert to appear.

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");
        }
    }
});