[CLOSED] Change Badge Properties from Code Behind

  1. #1

    [CLOSED] Change Badge Properties from Code Behind

    I'm trying to change some of the properties of a badge from code behind. The badge shows number that corresponds to the number of results if someone were to trigger a filter. I am not having any issue changing the text on the badge from code behind, but I'd like to either change the UI property (UI.Success if the count is 0, UI.Danger if the count > 0), but the badge isn't changing color. Alternatively, I'd be ok with the badge hiding if the count was 0, but that didn't work either. The text is updating just fine, though. Any thoughts on how to overcome this?

    Badge Markup (works fine)
                                        Html.X().Radio()
                                            .Name("rdoRequestStatus")
                                            .ID("rdoNewSearch")
                                            .BoxLabel("New")
                                            .BoxLabelCls("LabelSmallFont")
                                            .Checked(true)
                                            .Listeners(ls =>
                                            {
                                                ls.Change.Handler = "handleRadioCheck();";
                                            })
                                            .Plugins(
                                                Html.X().Badge()
                                                    .ID("badgeNewRequestCount")
                                                    .Text(Model.NewTicketCount.ToString())
                                                    .AlignmentSpec("r")
                                                    .OffsetY(-10)
                                                    .UI(Model.NewTicketCount > 0 ? UI.Danger.ToString() : UI.Success.ToString())
                                            ),
    Code Behind (Text does change, but the UI does not)
                int newCount = _requestService.GetRequestInfoCount_NewSupport(requestTypeGroupKeys, level);
    
                Badge badgeNew = X.GetCmp<Badge>("badgeNewRequestCount");
    
                badgeNew.Text = newCount.ToString();
                badgeNew.UI = newCount > 0 ? UI.Danger.ToString() : UI.Success.ToString();
  2. #2
    It appears that any attempt to update the UI property from code behind results in it getting a "Danger" UI.
  3. #3
    Any help on this? I'd love to be able to change the color of it from code behind. I'd even settle for being able to change the UI property from JavaScript.
  4. #4
    Nobody has any suggestions on this? I would've thought it was a quick answer and I just am missing something.
  5. #5
    <taps on microphone>

    Is this thing on?
  6. #6
    Hi. I apologize for the lack of response. Unfortunately, we only have the support staff available to focus on Premium support members and Premium forum threads.

    The Community forums are not monitored as closely and we rely on the Ext.NET community to help provide the support.

    We're hoping to get to this thread tomorrow (Thursday) and should be able to respond with some assistance at that time.
    Geoffrey McGill
    Founder & CEO
  7. #7
    Hello @craigthames,

    What you are trying to do should work as long as the badge has not been drawn to screen yet. You're just changing the badge's initial config. This won't do though, if you're changing an already rendered badge as your code suggests.

    What you need is to call the badge's setter method for the UI, which enables the right on time rendering of the value you passed.

    Unfortunately we don't have the SetUI() method defined at server side specifically for the Badge component, but the method is present in client side. This means no further development or extension should take place, you can just instead:

    badgeNew.Call("setUI", Model.NewTicketCount > 0 ? UI.Danger.ToString() : UI.Success.ToString());
    This should be all you need. Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  8. #8
    @fabricio

    Thank you so much for the help. Using what you sent, I was able to figure out a usable solution. I just called a change listener on the badge to be able to set it how I wanted.

    function updateBadge(badge) {
        var count = badge.html;
    
        if (count == '0') {
            badge.setUI("success");
        } else {
            badge.setUI("warning");
        }
    }
    This can be marked as closed.

Similar Threads

  1. [CLOSED] Change Badge on Tabpanel in code behind
    By reinout.mechant@imprss.be in forum 2.x Premium Help
    Replies: 4
    Last Post: Nov 17, 2014, 2:25 PM
  2. Replies: 4
    Last Post: Jun 11, 2014, 8:51 AM
  3. [CLOSED] Dynamically change CommandColumn properties
    By digitek in forum 1.x Premium Help
    Replies: 4
    Last Post: Nov 13, 2012, 1:50 PM
  4. Change Plugin Properties Dinamically
    By David Pelaez in forum 1.x Help
    Replies: 7
    Last Post: May 18, 2011, 3:35 PM
  5. Change Plugin Properties Dinamically
    By David Pelaez in forum 1.x Help
    Replies: 1
    Last Post: Dec 16, 2010, 12:09 PM

Posting Permissions