dynamically create ajax reorder list control

Question

0.00/5 (No votes)

See more:

ASP.NET

Ajax

HI all,

How can I create ajax created reorder list control programmatically?
Pls help.

Thanks

Posted 13-Jun-11 21:46pm

tmsu

Add a Solution

Comments

Sandeep Mewara 14-Jun-11 5:45am

Did you try anything? Can you be more specific?

tmsu 14-Jun-11 9:03am

I tried to create ajax reorder list control at runtime . when i set ItemTemplate of reorder list control it gave the problem. I don't want to declare reorder list control at design time.
pls advice me.
Regards

2 solutions

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Manfred Rudolf Bihy · Answer 1 · 2011-06-14T01:44:00

Solution 1

What about this: http://www.asp.net/ajax/ajaxcontroltoolkit/samples/ReorderList/ReorderList.aspx[^] or this http://forums.asp.net/t/1140310.aspx/1[^] or this http://www.xdevsoftware.com/blog/post/ReOrderList-Example-AJAXNET-Toolkit.aspx[^].
Here on CP I found this: ReorderList - bind to DataTable; save changes[^].

Regards,
-MRB

Posted 14-Jun-11 1:44am

Manfred Rudolf Bihy

Comments

tmsu 14-Jun-11 9:10am

Thanks for your link. I need to create the reorder list control at runtime in my application.
Regards

tmsu · Answer 2 · 2011-06-22T16:44:00

I can create reorderlist at run time. I can drag and reorder the items. But i got one issue reorderlist not showing based on SortOrderField . It shows according to sorderorder when i only select the data based on order by that field.
Below is my code

I override the OnItemReorder method.

VB

Public Class myReorderList
    Inherits ReorderList

VB

Protected Overrides Sub OnItemReorder(ByVal e As AjaxControlToolkit.ReorderListItemReorderEventArgs)
         Dim dataTable As DataTable = CType(Me.DataSource, DataTable)
        Dim oldIndex As Integer = e.OldIndex
        Dim newIndex As Integer = e.NewIndex
        Dim newPriorityOrder As Integer = CType(dataTable.Rows(newIndex)("Priority"), Integer)


        If newIndex > oldIndex Then
            For i As Integer = oldIndex + 1 To newIndex

                Dim propertyID As Integer = CType(dataTable.Rows(i)("CountryID"), Integer)
                If propertyID <> -1 Then
                    dataTable.Rows(i)("Priority") = CType(dataTable.Rows(i)("Priority") - 1, Integer)
                    ' call UpdateSortOrderField ' just for update in db
                   UpdateSortOrderField(propertyID, DirectCast(dataTable.Rows(i)("Priority"), Int32))
                 End If
            Next

        Else

            For i As Integer = oldIndex - 1 To newIndex Step -1
                Dim propertyId As Int32 = DirectCast(dataTable.Rows(i)("CountryID"), Int32)
                If propertyId <> -1 Then
                    dataTable.Rows(i)("Priority") = CInt(dataTable.Rows(i)("Priority")) + 1
                    'update in db
                  UpdateSortOrderField(propertyId, DirectCast(dataTable.Rows(i)("Priority"), Int32))
                  End If
            Next

        End If

        Dim id As Int32 = DirectCast(dataTable.Rows(oldIndex)("CountryID"), Int32)
        If id <> -1 Then
            UpdateSortOrderField(id, newPriorityOrder) 
         End If

        HttpContext.Current.Session("PropertyItems") = Nothing
       
    End Sub
       Private Sub UpdateSortOrderField(ByVal priorityID As Integer, ByVal priority As Integer)

        'Update Database

        Dim strconn As String = ""
        Dim conn As SqlConnection = New SqlConnection(strconn)
        conn.Open()
        Dim updatecmd As SqlCommand = New SqlCommand("update TblCountry set priority=@priority where CountryID=@CountryID  ", conn)
        updatecmd.Parameters.AddWithValue("@CountryID", DbType.Int32).Value = priorityID
        updatecmd.Parameters.AddWithValue("@priority", DbType.Int32).Value = priority

        updatecmd.ExecuteNonQuery()

    End Sub

End Class

/////Below is the aspx design page

XML

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="DynamicReorderList.aspx.vb" Inherits="DynamicReorderList" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="X-UA-Compatible" content="IE=7;" />

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
     <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>

    <div class="reorderlistDemo">
        <asp:PlaceHolder ID="placeholder1" runat="server"></asp:PlaceHolder>
    </div>

    </form>
</body>
</html>

///Below is the code behind page

VB

Imports System.Data
Imports System.Data.SqlClient
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports AjaxControlToolkit

Partial Class DynamicReorderList
    Inherits System.Web.UI.Page
    Dim reorderlist As myReorderList = New myReorderList()

VB

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Page.IsPostBack Then
            ViewState("IsEditMode") = False
            ViewState("EditIndex") = -1
        End If
        Me.DynamicGenerateReorderlist()

    End Sub

VB

Protected Sub Page_PreRender(ByVal sender As Object, ByVal e As EventArgs)
       Me.DynamicGenerateReorderlist()

   End Sub

VB

Private Sub DynamicGenerateReorderlist()

       reorderlist.ID = "ROL1"
       reorderlist.AllowReorder = True
       reorderlist.PostBackOnReorder = False
       reorderlist.EnableViewState = True
       reorderlist.ShowInsertItem = False
       reorderlist.DragHandleAlignment = ReorderHandleAlignment.Left
       reorderlist.CallbackCssStyle = "callbackStyle"



       reorderlist.ItemTemplate = New pagereorderItemTemplate()
       reorderlist.ReorderTemplate = New pagereorderReorderItemTemplate()
       reorderlist.DragHandleTemplate = New pagereorderHandleTemplate()
       reorderlist.EmptyListTemplate = New pagereorderEmptyTemplate()
       reorderlist.DataKeyField = "CountryID"
       reorderlist.SortOrderField = "Priority"
       AddHandler reorderlist.ItemDataBound, AddressOf reorderlist_ItemDataBound


       placeholder1.Controls.Add(reorderlist)
       placeholder1.Controls.Add(New LiteralControl("<br/>"))

        DisplayProperties() ' set datasource and bind


   End Sub
   <pre lang="vb">Protected Sub reorderlist_ItemDataBound(ByVal sender As Object, ByVal e As AjaxControlToolkit.ReorderListItemEventArgs)
       Dim currentItem As ReorderListItem = DirectCast(e.Item, ReorderListItem)
       Dim drv As DataRowView = DirectCast(currentItem.DataItem, DataRowView)

       If (reorderlist.EditItemIndex > -1 And (currentItem.DisplayIndex = reorderlist.EditItemIndex)) Then
           'Show data in EditTemplate
         Else

           ' Dim lblID As Label = CType(e.Item.FindControl("lblID"), Label)
           'lblID.Text = "<div class=""textArea"">" & drv("CountryID").ToString() & "</div>"
           Dim lblTitle As Label = CType(e.Item.FindControl("lblTitle"), Label)
           lblTitle.Text = "<div class=""textArea"">" & drv("Country").ToString() & "</div>"
           Dim img1 As Image = CType(e.Item.FindControl("img1"), Image)
           img1.ImageUrl = "~\Image\" & drv("Country").ToString() & ".jpg"


       End If

   End Sub

VB

Private Sub DisplayProperties()

       Dim strconn As String = ""
       Dim conn As SqlConnection = New SqlConnection(strconn)

       Dim selectcmd As SqlCommand = New SqlCommand("select CountryID,Code,Country,Priority from TblCountry order by Priority ", conn)
       Dim da As SqlDataAdapter = New SqlDataAdapter(selectcmd)

       If DirectCast(ViewState("IsEditMode"), Boolean) = False Then
           If (Not Page.IsPostBack) Or HttpContext.Current.Session("PropertyItems") Is Nothing Then
               'get the data from the databse for the first time or session("PropertyItems")=nothing
               Dim dsProperties As DataSet = New DataSet()
               Try
                   da.Fill(dsProperties)
                                    If dsProperties.Tables(0).Rows.Count > 0 Then
                       Dim dtProperties As DataTable = dsProperties.Tables(0)

                       HttpContext.Current.Session("PropertyItems") = Nothing
                       HttpContext.Current.Session("PropertyItems") = dtProperties

                   End If
               Catch ex As Exception

               End Try
           End If
           Me.reorderlist.DataSource = DirectCast(HttpContext.Current.Session("PropertyItems"), DataTable)
           Me.reorderlist.DataBind()
       End If

   End Sub

VB

Private Class pagereorderItemTemplate
        Implements ITemplate

        Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn
            Dim lblTitle As Label = New Label()
            lblTitle.ID = "lblTitle"
            AddHandler lblTitle.DataBinding, AddressOf lblTitle_DataBinding
            container.Controls.Add(lblTitle)

            Dim img1 As Image = New Image()
            img1.ID = "img1"
            AddHandler img1.DataBinding, AddressOf img1_DataBinding
            container.Controls.Add(img1)

        End Sub
        Private Sub lblTitle_DataBinding(ByVal sender As Object, ByVal e As EventArgs)
            Dim lblTitle As Label
            lblTitle = CType(sender, Label)
            Dim item As ReorderListItem = CType(lblTitle.NamingContainer, ReorderListItem)
            Dim dataitem As String = DataBinder.Eval(item.DataItem, "Country").ToString()
            lblTitle.Text = dataitem '& "</div>"
        End Sub
        Private Sub img1_DataBinding(ByVal sender As Object, ByVal e As EventArgs)
            Dim img As Image
            img = CType(sender, Image)
            Dim item As ReorderListItem = CType(img.NamingContainer, ReorderListItem)
            Dim dataitem As String = DataBinder.Eval(item.DataItem, "Country").ToString()
            img.ImageUrl = "~\Image\" & dataitem & ".jpg"
        End Sub
    End Class
    Private Class pagereorderReorderItemTemplate
        Implements ITemplate

        Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn
            Dim pn As Panel = New Panel()
            pn.ID = "panel2"
            pn.CssClass = "reorderCue"
            container.Controls.Add(pn)
        End Sub
    End Class
    Private Class pagereorderHandleTemplate
        Implements ITemplate

        Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn
            Dim lc As Literal = New Literal()
            lc.Text = "<div class=""dragHandle"">" & "||" & "</div>"
            container.Controls.Add(lc)
        End Sub
    End Class
    Private Class pagereorderEmptyTemplate
        Implements ITemplate

        Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn
            Dim lc As Literal = New Literal()
            lc.Text = "empty"
            container.Controls.Add(lc)
        End Sub
    End Class
End Class

dynamically create ajax reorder list control

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

dynamically create ajax reorder list control

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

Existing Members

...or Join us