How to get List item's attribute in context menu's selection? Telerik

Question

I am working with ASP.NET and I have two RadListBox. Data in first box is populated from database using RadListBoxItem and I have set an attribute for each item. In the second box, I've enabled custom context menu. After I adding the item from first box to second box, user can select some option using the context menu. On context menu selection, I need to get the Attribute I set before and update the attribute value according to the context menu selection so I can used it for later process.Currently, I unable to even read the attributes I set previously using the context menu's javascript. Please guide how to read ListItem's attribute and update the attribute to a new value.

This is how I add the item to the first box with attribute from code behind.

this._sortingList = new List<Sorting>();
this._sortingList = DBConnection.getSortingList();

foreach (var s in this._sortingList)
{
    RadListBoxItem item = new RadListBoxItem();
    item.Text = s.Description;
    item.Value = s.Id.ToString();
    item.Attributes["myorder"] = "0";
    this.RadListBox1.Items.Add(item);
}

This is custom context menu javascript.

function showContextMenu(sender, e) {
var menu = $find("<%= cm1.ClientID %>");
var rawEvent = e.get_domEvent().rawEvent; menu.show(rawEvent);
e.get_item().select();
$telerik.cancelRawEvent(rawEvent);

}

function onItemClicked(sender, e) {
var listBox = $find("<%= RadListBox1.ClientID %>");
var listItem = listBox.get_selectedItem();
var menuItem = e.get_item();
if (menuItem.get_text() == "Ascending"){
    alert(listItem.get_attributes().getAttribute("myorder"));
}
else if (menuItem.get_text() == "Descending") {
    alert(listItem.get_attributes().getAttribute("myorder"));
}
}

The context menu's if else statement is working. I tested with some random alert and it can work. Sorry for my English.

Answer 1

Add the following property to RadListBox.

OnClientContextMenu="list_ClientContextMenu"

Declare a RadContenxtMenu as follows.

<telerik:RadContextMenu ID="cmEdit" runat="server" OnClientItemClicked="cm_ClientItemClicked" Skin="Vista">
    <Items>
        <telerik:RadMenuItem Text="Edit" Value="e">
        </telerik:RadMenuItem>
    </Items>
</telerik:RadContextMenu>

Add a hidden field to get the client ID.

<asp:HiddenField runat="server" ID="hdnCmSelectedList" />

Finally add the JS to handle it.

function list_ClientContextMenu(sender, e) {
    var menu = $find("<%= cmEdit.ClientID %>");
    var rawEvent = e.get_domEvent().rawEvent; menu.show(rawEvent);
    e.get_item().select();
    var listName = sender.get_id();
    if (listName.indexOf('listEmail') != -1) {
        $get("<%= hdnCmSelectedList.ClientID %>").value = 'pe';
}

function cmEditAdmin_ClientItemClicked(sender, e) {
            $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequestWithTarget("<%= lnkBtnEdit.UniqueID %>", '');
        }

Add a button with click handler as well.

<asp:LinkButton runat="server" ID="lnkBtnEdit" OnClick="lnkBtnEdit_Click"></asp:LinkButton>

Now in the code behind.

protected void lnkBtnEdit_Click(object sender, EventArgs e)
{
    RadListBoxItem item;
    switch (hdnCmSelectedList.Value)
    case "pe":
        item = list.SelectedItem;
        if (item != null)
        {
            comboPendingDurationEmail.FindItemByValue(item.Attributes["myorder"]).Selected = true;
        }
        break;
}

Let me know, how that works out.