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

[Ed]

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

[Shinu]

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.

[Ed]

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();

[Matt]

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?

[Peter Milchev]

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