Selection issues with Treeview in Chrome on Android

[marksweat]

I just updated my application to the 2014_1_401 release. It works great on my PC in IE and Chrome.

When I run it on my Android tablet in the Chrome Browser, selection of items in the Treeview isn't working properly. The newly selected items shows selected by previous items don't unselect. Selection doesn't cause the app to post back.

I was thinking maybe there was just some sticky javascript files left over on the tablet. I dumped the cache and local data but this didn't help.

This was working fine with the previous version of the product.

Several different users have confirmed this issue with different Android devices.

--Mark

[Dimitar]

Hello,

The issue reported is a known one. It has already been logged for fixing. I have increased its priority and I have created a public Ideas & Feedback Portal item, where you can track its status, vote for it and comment it.

In addition, there is another related RadTreeView issue in mobile browsers. You may review it in our Ideas & Feedback portal as well. There is a workaround provided for it in the Portal item's description.

Currently, setting EnableDragAndDrop="false" to the RadTreeView prevents both issues.

I have replied to your support ticket as well. In order to avoid threads duplication I would suggest that we continue this conversation in the support ticket thread, if necessary.

Regards,
Dimitar
Telerik

 

 

[Kjell]

I also have this problem that it is not possible to generate postback on Android and iOS tablet.
It works great on my PC........

When will this be resolved? Have been over 2 years ago ....

[Vessy]

Hi Kjell,

Both of the issues discussed in this thread has been already handled and the fixes for them was included in the following releases
 - Q3 2014 for this item and
 - Q1 2015 for this item

Can you, please, verify that you are using version of the controls released after Q1 2015? If so, can you, please, share the exact setup you have, so we can reproduce the problem and examine the cause for it?

Regards,
Vessy
Progress Telerik

[Kjell]

Sorry late answer….

I use Version: 2018.2.516 and still have this problem....

<telerik:RadAjaxPanel ID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1" runat="server">
    <telerik:RadTreeView ID="RadTreeView1"
        EnableDragAndDrop="true"
        EnableDragAndDropBetweenNodes="true"
        OnNodeDataBound="RadTreeView1_NodeDataBound"
        OnNodeDrop="RadTreeView1_NodeDrop"
        Skin="Silk"
        runat="server">
        <DataBindings>
            <telerik:RadTreeNodeBinding Expanded="false" />
        </DataBindings>
    </telerik:RadTreeView>
</telerik:RadAjaxPanel>

 

 

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If Not Page.IsPostBack Then
        BindToDataTable(RadTreeView1)
    End If
End Sub

'....................................

Private Sub BindToDataTable(ByVal treeView As RadTreeView)
    Dim MyConnection As New SqlConnection(System.Configuration.ConfigurationManager.AppSettings.Get("xxxxxxxxx"))
    Dim adapter As New SqlDataAdapter("select NodeId, ParentNodeId, DeleteOk, Arkivera, sortid, sidnamn, ImageUrl, tidsstyrning from sidor Order By SortId ASC, NodeId ASC", MyConnection)
    Dim dataTable As New DataTable()

    adapter.Fill(dataTable)
    treeView.DataSource = dataTable
    treeView.DataFieldID = "NodeId"
    treeView.DataFieldParentID = "ParentNodeId"
    treeView.DataValueField = "NodeId"
    treeView.DataBind()
End Sub

'....................................

Protected Sub RadTreeView1_NodeDataBound(ByVal sender As Object, ByVal e As RadTreeNodeEventArgs)

    e.Node.ToolTip = "SortId=" & (TryCast(e.Node.DataItem, DataRowView))("sortid").ToString()
    e.Node.ImageUrl = "images/rtTree/" & (TryCast(e.Node.DataItem, DataRowView))("ImageUrl").ToString()
    e.Node.ForeColor = Color.Black

    If (TryCast(e.Node.DataItem, DataRowView))("NodeId").ToString() < 4 Then
        e.Node.Text = (TryCast(e.Node.DataItem, DataRowView))("sidnamn").ToString()
        e.Node.AllowDrag = False
        e.Node.Selected = False
    Else
        e.Node.Text = (TryCast(e.Node.DataItem, DataRowView))("sidnamn").ToString() & vbCrLf & "(" & (TryCast(e.Node.DataItem, DataRowView))("NodeId").ToString() & ")"
        e.Node.NavigateUrl = "dbpage.aspx?id=" & (TryCast(e.Node.DataItem, DataRowView))("NodeId").ToString()
        e.Node.Target = "MainFrame"
    End If

    If e.Node.DataItem("DeleteOk") = True Then
        e.Node.ForeColor = Color.Red
        e.Node.Font.Strikeout = True
    End If

    If e.Node.DataItem("Arkivera") = True Then
        e.Node.ForeColor = Color.Gray
        e.Node.Font.Italic = True
    End If

    If e.Node.DataItem("tidsstyrning") = True Then
        e.Node.ToolTip = "Tidsstyrd sida"
        e.Node.ForeColor = Color.DarkOrange
        e.Node.Font.Bold = True
    End If

End Sub

'....................................

Protected Sub RadTreeView1_NodeDrop(ByVal sender As Object, ByVal e As RadTreeNodeDragDropEventArgs)

    Dim MyNodeId As Integer = CInt(e.SourceDragNode.Value)
    Dim MyParentNodeId As Integer = CInt(e.DestDragNode.Value)
    Dim MyDropPosition As RadTreeViewDropPosition = e.DropPosition

    Dim MyConnection As New SqlConnection(System.Configuration.ConfigurationManager.AppSettings.Get("xxxxxxxxxxxx"))

    Dim UpdateCmd As String = "UPDATE sidor SET ParentNodeId = @ParentNodeId, ImageUrl = @ImageUrl, uppdaterad = @uppdaterad WHERE NodeId = @id"
    Dim MyCommand As New SqlCommand(UpdateCmd, MyConnection)

    MyCommand.Parameters.Add(New SqlParameter("@ParentNodeId", SqlDbType.Int, 4))

    If MyDropPosition = 1 Then
        MyCommand.Parameters("@ParentNodeId").Value = DBNull.Value
    Else
        If e.DestDragNode.Value Is DBNull.Value Then
            MyCommand.Parameters("@ParentNodeId").Value = DBNull.Value
        Else
            MyCommand.Parameters("@ParentNodeId").Value = MyParentNodeId
        End If
    End If

    MyCommand.Parameters.Add(New SqlParameter("@ImageUrl", SqlDbType.VarChar, 50))
    If MyDropPosition = 1 Then
        MyCommand.Parameters("@ImageUrl").Value = "root.gif"
    Else
        If e.DestDragNode.Value Is DBNull.Value Then
            MyCommand.Parameters("@ImageUrl").Value = "root.gif"
        Else
            MyCommand.Parameters("@ImageUrl").Value = "subpage.gif"
        End If
    End If

    MyCommand.Parameters.Add(New SqlParameter("@uppdaterad", SqlDbType.SmallDateTime, 4))
    MyCommand.Parameters("@uppdaterad").Value = Now

    MyCommand.Parameters.Add(New SqlParameter("@id", SqlDbType.Int, 4))
    MyCommand.Parameters("@id").Value = MyNodeId

    Try
        If MyConnection.State = ConnectionState.Closed Then
            MyConnection.Open()
        End If
        MyCommand.ExecuteNonQuery()

        lblMsg.ForeColor = Drawing.Color.White
        lblMsg.Text = "<img src='images/thumb/info.png' alt='Information' width='12' height='11' align='absmiddle' />  "
        lblMsg.Text += "Sida flyttad"

        ScriptManager.RegisterClientScriptBlock(Me, Me.[GetType](), "scr", "parent.main.location.replace('start.aspx');", True)

    Catch exc As SqlException
        Dim msg As New EmailMessage()
        Dim felmeddelande As String = radbryt(exc.ToString())

        msg.LoadFromConfig()
        msg.Body = felmeddelande
        msg.Send()

    Finally
        MyCommand.Dispose()
        MyConnection.Close()

    End Try

    '---------------------------------------

    Dim node As RadTreeNode = e.DestDragNode
    Dim MyDeleteId As Integer = node.Value
    Dim MyArkiveraId As Integer = node.Value
    Dim currentObject As RadTreeNode = node.ParentNode

    While currentObject IsNot Nothing
        If currentObject.Parent IsNot Nothing Then
            MyDeleteId = currentObject.Value
            MyArkiveraId = currentObject.Value
        End If
        currentObject = currentObject.ParentNode
    End While

    Dim UpdateDeleteOkCmd As String
    If MyDeleteId = 1 And MyDropPosition = 0 Then
        UpdateDeleteOkCmd = "Exec RadJa @Myid"
    ElseIf MyDeleteId = 1 And MyDropPosition = 2 Then
        UpdateDeleteOkCmd = "Exec RadJa @Myid"
    Else
        UpdateDeleteOkCmd = "Exec RadNej @Myid"
    End If

    MyCommand = New SqlCommand(UpdateDeleteOkCmd, MyConnection)

    MyCommand.Parameters.Add(New SqlParameter("@Myid", SqlDbType.Int, 4))
    MyCommand.Parameters("@Myid").Value = MyNodeId

    Try
        If MyConnection.State = ConnectionState.Closed Then
            MyConnection.Open()
        End If
        MyCommand.ExecuteNonQuery()

    Catch exc As SqlException
        Response.Write(exc)

    Finally
        MyCommand.Dispose()
        MyConnection.Close()

        BindToDataTable(RadTreeView1)
    End Try

    '---------------------------------------

    Dim UpdateArkiveraCmd As String
    If MyArkiveraId = 2 And MyDropPosition = 0 Then
        UpdateArkiveraCmd = "Exec ArkJa @Myid"
    ElseIf MyArkiveraId = 2 And MyDropPosition = 2 Then
        UpdateArkiveraCmd = "Exec ArkJa @Myid"
    Else
        UpdateArkiveraCmd = "Exec ArkNej @Myid"
    End If

    MyCommand = New SqlCommand(UpdateArkiveraCmd, MyConnection)

    MyCommand.Parameters.Add(New SqlParameter("@Myid", SqlDbType.Int, 4))
    MyCommand.Parameters("@Myid").Value = MyNodeId

    Try
        If MyConnection.State = ConnectionState.Closed Then
            MyConnection.Open()
        End If
        MyCommand.ExecuteNonQuery()

    Catch exc As SqlException
        Response.Write(exc)

    Finally
        MyCommand.Dispose()
        MyConnection.Close()

        BindToDataTable(RadTreeView1)
    End Try

End Sub

'....................................

Protected Sub DeleteTrash_Command(ByVal sender As Object, ByVal e As CommandEventArgs)

    Dim CommandName As String = CType(e, System.Web.UI.WebControls.CommandEventArgs).CommandName.ToString()

    If CommandName = "DeleteTrash" Then

        Dim MyConnection As New SqlConnection(System.Configuration.ConfigurationManager.AppSettings.Get("xxxxxxxxxx"))
        Dim DeleteCmd As String = "DELETE from sidor where DeleteOk = @ok"
        Dim MyCommand As New SqlCommand(DeleteCmd, MyConnection)

        MyCommand.Parameters.Add(New SqlParameter("@ok", SqlDbType.Bit, 1))
        MyCommand.Parameters("@ok").Value = True

        Try
            If MyConnection.State = ConnectionState.Closed Then
                MyConnection.Open()
            End If
            MyCommand.ExecuteNonQuery()

            lblMsg.ForeColor = Drawing.Color.White
            lblMsg.Text = "<img src='images/thumb/info.png' alt='Information' width='12' height='11' align='absmiddle' />  "
            lblMsg.Text += "Papperskorg tömd!"

            ScriptManager.RegisterClientScriptBlock(Me, Me.[GetType](), "scr", "parent.main.location.replace('start.aspx');", True)

        Catch exc As SqlException
            Dim msg As New EmailMessage()
            Dim felmeddelande As String = radbryt(exc.ToString())

            msg.LoadFromConfig()
            msg.Body = felmeddelande
            msg.Send()

        Finally
            MyCommand.Dispose()
            MyConnection.Close()

            BindToDataTable(RadTreeView1)

        End Try

    End If

End Sub

 

[Peter Milchev]

Hello Kjell,

We tried to replicate the issue with the attached project and there was no issue when tested on an Android device - dropping a node with a value bigger than 4 redirects correctly to start.aspx. Keep in mind that we made a small improvement to the redirect function in order to make it work:

1) Change the target to _blank. The Target property supports standard HTML targets (i.e. _self, _blank, _top, _parent) - https://docs.telerik.com/devtools/aspnet-ajax/controls/treeview/radtreeview-nodes/overview. 

2) use window.location instead of parent.main.location

If you still encounter the issues, please modify the attached project and send it back to us in an official support ticket along with more details and specific examples on the reproduction steps and expected and actual behaviors. 

Also, you can check if there are any JavaScript errors when running on the mobile device. You can also check the Mobile Simulator of Google Chrome as explained in Simulate Mobile Device Rendering.

Regards,
Peter Milchev
Progress Telerik