List box with drag drop loosing attribute values

6 posts, 0 answers
  1. Devendra
    Devendra avatar
    2 posts
    Member since:
    Jun 2010

    Posted 09 Jul 2010 Link to this post

    Hi

    I have three rad listboxes with drag and drop feature. In each list box have Items with image associated to click event call a pupup window page. I have also added some attributes to each item. Eevrything works fine, only problem i am facing is when i drag and drop any item from one list box to another the dragged item is loosing its attributes and associated click event with it.

    I tried comibination of several properties on listboxes control but no luck.

    <

     

    telerik:RadListBox ID="PageHierarchies" runat="server" Width="200px" Height="200px"

     

     

            TransferToID="ColumnHierarchies" AllowReorder="true" AutoPostBackOnReorder="false"

     

     

            AllowTransfer="true" AutoPostBackOnTransfer="false" EnableDragAndDrop="true"

     

     

            AutoPostBack="false" OnClientDragging="DraggingItem"  OnClientTransferred="ItemTransferrd" AllowAutomaticUpdates="true" EnableViewState="true" PersistClientChanges=true >

     

     

        <ButtonSettings ShowReorder="false" ShowTransfer="false" ShowTransferAll="false" />

     

     

    </telerik:RadListBox>

    Javascipt code to add attributes (higlighted in italic bold)

     

    <

     

    script type="text/javascript">

     

     

     

     

     

    //<![CDATA[

     

     

     

     

     

     

    var columnHirachcy;

     

     

    var rowHirachcy;

     

     

    var pageHirachcy;

     

     

    var dimname;

     

     

    var dimID;

     

     

    var infosetname;

     

     

    var strParms;

     

     

     

    function

     

    pageLoad(sender)

     

    {

     

     

     

    var listboxItem;

     

     

    var membersCount;

     

     

    var items;

     

     

    var objJson;

     

     

    columnHirachcy = $find(

    "<%= ColumnHierarchies.ClientID %>");

     

    rowHirachcy = $find(

    "<%= RowHierarchies.ClientID %>");

     

    pageHirachcy = $find(

    "<%= PageHierarchies.ClientID %>");

     

     

    objJson=window.top.GetIFrame().document[

    'report1_json'];

     

     

    //Column Hiraarchy

     

     

     

     

    infosetname=objJson[0].name;

     

     

    var infosetObj = window.top.getInfoSetByName(infosetname);

     

     

     

    for(axisIndex=0;axisIndex<=2;axisIndex++)

     

    {

     

    switch(axisIndex)

     

    {

     

    case 0:

     

    items=columnHirachcy;

     

    break;

     

     

    case 1:

     

    items=rowHirachcy;

     

    break;

     

     

    case 2:

     

    items=pageHirachcy;

     

    break;

     

    }

     

    var dimCollection = infosetObj['axis' + axisIndex];

     

     

    for(i=0;i<dimCollection.length;i++)

     

    {

    dimID = dimCollection[i].uname;

    dimName = dimCollection[i].name;

     

    membersCount =window.top.getMembersCount(infosetname,dimName,axisIndex,i);

     

    var listboxItem =new Telerik.Web.UI.RadListBoxItem();

     

    listboxItem.set_text(dimName +

    "[" + membersCount + "]");

     

    listboxItem.set_value(dimID);

    listboxItem.set_selected(

    false);

     

    listboxItem.set_imageUrl(

    "../Images/Filter.gif");

     

    items.trackChanges();

    items.get_items().add(listboxItem);

    items.getItem(i).get_imageElement().setAttribute(

    "alt",dimName);

     

    items.getItem(i).get_imageElement().setAttribute(

    "infosetName",infosetname);

     

    items.getItem(i).get_imageElement().setAttribute(

    "dimName",dimName);

     

    items.getItem(i).get_imageElement().setAttribute(

    "dimID",dimID);

     

    items.getItem(i).get_imageElement().setAttribute(

    "PivotingMode","Full");

     

    items.getItem(i).get_imageElement().setAttribute(

    "Hirarchy",listboxItem);

     

     

     

     

     

     

     

     

    items.getItem(i).get_imageElement().onclick=

    function(){

     

     

    window.top.openSelectorForPivoting(

    this.getAttribute('infosetName'),this.getAttribute('dimName'),this.getAttribute('dimID'),this.getAttribute('PivotingMode'),this.getAttribute('Hirarchy'));

     

     

    };

     

     

     

     

     

    items.commitChanges();

    }

    }

     

     

    return false;

     

     

    }

  2. Genady Sergeev
    Admin
    Genady Sergeev avatar
    1600 posts

    Posted 15 Jul 2010 Link to this post

    Hello Devendra,

    Items losing their attributes when being drag&dropped seems to e a bug in RadListBox. I've logged it into our bug-tracking system and we will fix it for the next week's latest internal build. More information on how to obtain the latest internal build can be found here.

    As for the click event, how do you attach it? By default, all RadListBox events are for the RadListBox, not for the items. By design, when a given item is transferred to another RadListBox they will receive the events attached on the latter RadListBox. Not on the source.

    Greetings,
    Genady Sergeev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Jules
    Jules avatar
    20 posts
    Member since:
    Jul 2005

    Posted 26 Mar 2012 Link to this post

    I am having a similar problem with version 2012.1.215.40. I have two RadListBoxes, one is databound. Attributes are added in the ItemDataBound event. Users drag items from this box into the second box. I am trying to validate the items in the second box in client side script based on the values of particular attributes.

    var listbox = $find("<%= firstListBox.ClientID %>");
    listbox.get_items().forEach(function(item) {
      var liItem = item.get_element();
      var attribute = liItem.getAttribute("Commutable");
      alert(attribute);
    });

    It just returns null.

    Any suggestions?
  4. Bozhidar
    Admin
    Bozhidar avatar
    1124 posts

    Posted 28 Mar 2012 Link to this post

    Hello Julia,

    I've answered your support ticket, but I'll explain the reason behind this issue here as well, so that other people can see the solution.

    When working with custom attributes, you have to use the attributes stored inside the client object of the ListBoxItem, instead of the html attributes. In other words, here's how the correct code should look like:
    listbox.get_items().forEach(function(item) {
        var attribute = item.get_attributes().getAttribute("Commutable");
        alert(attribute);
    });

     
    Kind regards,
    Bozhidar
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Garry
    Garry avatar
    44 posts
    Member since:
    Sep 2012

    Posted 03 Apr 2012 Link to this post

    Bozhidar
    This is not working for me with latest Telerik RadListBox.
    I set the attributes on the server:
    For Each formTab As CFormDesignerTab In fd.FormTabList(sPageName)
                Dim item As New Telerik.Web.UI.RadListBoxItem(formTab.Caption)
                item.ImageUrl = formTab.ImageURL
                item.Attributes.Add("ID", formTab.ID)
                lst.Items.Add(item)
    Next
    And in my Javascript, I access the attributes as follows:
    for (var i = 0; i < iCount; i++)
    {
         var attributes = item.get_attributes();
         var sTabID = attributes.getAttribute["ID"];
         var attribute = item.get_attributes().getAttribute("ID");
    }


    But the attributes are always 'undefined'.
  6. Bozhidar
    Admin
    Bozhidar avatar
    1124 posts

    Posted 04 Apr 2012 Link to this post

    Hello Garry,

    We found out that the problem actually did exist, but was only reproducible when the TransferMode of the listbox was set to Copy. The issue has now been resolved and you can get the fixed version in the upcoming Service Pack, which should come out in two weeks.

    Regards,
    Bozhidar
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top