How to update the EmptyMessage text using the *client-side* API

5 posts, 0 answers
  1. Ed
    Ed avatar
    124 posts
    Member since:
    Jan 2008

    Posted 23 Sep 2013 Link to this post

    Hi everyone,

    On the server, I can do this:

    RadListBox1.EmptyMessage = "No items available";

    How can I then alter this text later using the client-side API?  The equivalent function or property does not seem to exist.

    My project makes extensive use of AJAX and client-side updating, which can leave some of my list-boxes in an "indeterminate state" as they can only be adequately updated on the server (through data-binding).  Therefore I want to be able to clear these list-boxes on the client and display a temporary message that says "Click this button to refresh the list", where the button will then trigger a post-back and cause the current data to be bound to the list-box on the server.  Does that make sense?

    Ed Graham
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 24 Sep 2013 Link to this post

    Hi Ed,

    You can use jQuery to achieve your requirement. Please have a look at the following code to clear the RadListBox items from client and update it with a new Empty Message.

    JavaScript:
    var radlistbox = $find('<%=RadListBox1.ClientID %>');
    radlistbox.get_items().clear();
    $telerik.$('.rlbEmptyMessage').text("New Empty Message");
    radlistbox._updateEmptyMessageVisibilty();

    Thanks,
    Shinu.
  3. Ed
    Ed avatar
    124 posts
    Member since:
    Jan 2008

    Posted 24 Sep 2013 Link to this post

    Thanks, Shinu -- that works well in the case where there is only one list-box.  In my project I have several, so I needed to modify your code to this:

    var listBoxID = '<%=RadListBox1.ClientID %>';
    var radlistbox = $find(listBoxID);
    radlistbox.get_items().clear();
    // this works nicely when there is just one list-box
    //$telerik.$('.rlbEmptyMessage').text("New Empty Message");
    // *note*: the space before ".rlbEmptyMessage" is vital! (the whole string is a CSS selector, and they are very sensitive to syntax)
    $telerik.$('#' + listBoxID + ' .rlbEmptyMessage').text("New Empty Message");
    radlistbox._updateEmptyMessageVisibilty();
  4. Matt
    Matt avatar
    97 posts
    Member since:
    Jun 2012

    Posted 20 Nov 2018 in reply to Ed Link to this post

    I know this post is a few years old but then so is my copy of Telerik...

    function ChangeEmptyMessage(sender, args) {
                var source = $find('<%=RLB_Associates_Source.ClientID %>');
                var destination = $find('<%=RLB_Associates_Destination.ClientID %>');
                if (source.get_items().get_count() == 0) {
                    $telerik.$('#' + source + ' .rlbEmptyMessage').text("All associates have been selected for the transfer.<br/><br/>You can remove associates as well as add them.");
                    source._updateEmptyMessageVisibilty();
                }
                if (destination.get_items().get_count() == 0) {
                    $telerik.$('#' +destination + ' .rlbEmptyMessage').text("At least one associate must be placed in the 'Destination' box.<br/><br/>Please select at least one by double-clicking, dragging or using the arrow buttons.");
                    destination._updateEmptyMessageVisibilty();
                }
            };

    And I get...

    Error: Syntax error, unrecognized expression: #[object Object] .rlbEmptyMessage

    Any ideas anyone?

  5. Peter Milchev
    Admin
    Peter Milchev avatar
    588 posts

    Posted 23 Nov 2018 Link to this post

    Hello Matt,

    The $find() method will return the client-side object of the ListBox. There are a couple approaches you can use to achieve the desired result: 

    Approach 1: use the ListBox API to get the element

    var listbox = $find("<%= RadListBox1.ClientID %>");
    var $emptyMessage = $telerik.$(listbox.get_element()).find(".rlbEmptyMessage");
    $emptyMessage.text(message);

    Approach 2: use the ID of the ListBox via the API

    var listbox = $find("<%= RadListBox1.ClientID %>");
    var $emptyMessage = $telerik.$("#" + listbox.get_id() + " .rlbEmptyMessage");
    $emptyMessage.text(message);

    Approach 3: use the ID directly

    var $emptyMessage = $telerik.$("#<%= RadListBox1.ClientID %> .rlbEmptyMessage");
    $emptyMessage.text(message);

    Regards,
    Peter Milchev
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top