在VB/ASP中使用运行时创建的控件进行拖放

Question

这是我第一次在Stackoverflow上发帖，但我已经阅读了几个月的问题和答案！现在，我被困住了，我迫切需要帮助。

背景信息:网站位于http://www.mobiuspc.com，相关的部分是我第一行导航上的“配置器”按钮。

所有内容都是用最新版本的VB.NET和ASP3.5编写的，而且我的主机上有一台SQL2005服务器。

这是我进退两难的地方：

在页面加载过程中，我得到了部件表中所有部件的列表。然后，我为每个条目创建一个图像对象和两个label对象，并将它们放在我的高级折叠面板控件中。到目前为止工作得很好，我可以得到一个巨大的图片和文本列表，这些图片和文本按照我喜欢的方式排列(现在)。现在-我真的需要一种方法，能够让访问者将图像/标签/标签组合从手风琴拖到右侧当前不可见的面板(或其他任何东西)上。一旦拖拽的东西被放到拖放目标中，我希望它能触发我用VB编写的函数或sub。

从我对jquery的了解来看，显然有一种方法可以让我的网页上的元素成为可拖动、可拖放的，或者其他任何东西。它的示例代码-我不完全理解，所以一个快速示例将是很好的。我学得很快，可以把它应用到我的项目中。更重要的是，我如何让在运行时创建的对象是可拖动的，并触发我用我唯一知道的语言编写的事件？

下面是我如何按原样生成我的运行时对象：

Public Function loadallimages()
    Dim brandholder As ArrayList = New ArrayList
    Dim partnumberholder As ArrayList = New ArrayList
    Dim modelholder As ArrayList = New ArrayList
    Dim imageinsert As Image
    Dim labelinsert1 As Label
    Dim labelinsert2 As Label
    Dim gridinsert As Table
    Dim gridrow1 As TableRow
    Dim gridrow2 As TableRow
    Dim gridrow3 As TableRow
    Dim gridcell1 As TableCell
    Dim gridcell2 As TableCell
    Dim gridcell3 As TableCell
    Dim switcher As Integer = 0

    conn.ConnectionString = connstring 'I got my fancy connection string stored elsewhere
    conn.Open()

    'Add all images to the chassis section
    inserter = "SELECT Brand,PartNumber,Model FROM Chassis" 'this is the command I'm sending to the SQL command
    sqlmagicmaker = New SqlCommand(inserter, conn) 'this is the actual sql command object, created in my declarations
    bloater = fucker.ExecuteReader 'bloater is my easy way of remembering "data reader object"
    Do While bloater.Read
        brandholder.Add(bloater.Item("Brand").ToString)
        partnumberholder.Add(bloater.Item("PartNumber").ToString)
        modelholder.Add(bloater.Item("Model").ToString)
    Loop
    bloater.Close() 'can't forget to close it!



    For i = 0 To brandholder.Count - 1
        imageinsert = New Image 'make new objects and give them ID's later
        labelinsert1 = New Label
        labelinsert2 = New Label
        If switcher = 0 Then 'this is my ghetto way of getting 3 "chunks" of data in a row
            gridinsert = New Table
            gridrow1 = New TableRow
            gridrow2 = New TableRow
            gridrow3 = New TableRow
        End If
        gridcell1 = New TableCell
        gridcell2 = New TableCell
        gridcell3 = New TableCell
        gridcell1.CssClass = "configgridcell" 'just sets the width so it looks nice
        gridcell2.CssClass = "configgridcell"
        gridcell3.CssClass = "configgridcell"

        imageinsert.ImageUrl = ".\Images\Chassis\" + brandholder(i) + "{}" + partnumberholder(i) + ".jpg"
        imageinsert.ID = brandholder(i) + "{}" + partnumberholder(i)
        labelinsert1.Text = brandholder(i)
        labelinsert2.Text = modelholder(i)
        imageinsert.AlternateText = "No Image"

        gridrow1.Cells.Add(gridcell1) 'create a table and add controls
        gridrow1.Cells(switcher).Controls.Add(imageinsert)
        gridrow2.Cells.Add(gridcell2)
        gridrow2.Cells(switcher).Controls.Add(labelinsert1)
        gridrow3.Cells.Add(gridcell3)
        gridrow3.Cells(switcher).Controls.Add(labelinsert2)
        If switcher = 2 Then
            gridinsert.Rows.Add(gridrow1) 'compile all the rows and put into a table
            gridinsert.Rows.Add(gridrow2)
            gridinsert.Rows.Add(gridrow3)
            AccordionPane1.ContentContainer.Controls.Add(gridinsert) 'dump the table in the appropriate accordion pane
        End If
        switcher = switcher + 1
        If switcher = 3 Then switcher = 0 'do it all over again

    Next
    brandholder.Clear()
    partnumberholder.Clear()
    modelholder.Clear()
    switcher = 0
    'then we go onto other sections, which basically do the exact same thing to other accordions

然后页面加载我所有的图像/标签/标签对象三元组。很多。在这一点上，性能不是问题，我只希望我的想法能行得通。同样的想法是，一旦我以某种方式神奇地将我创建的一个对象“拖”到dropzone中，然后松开鼠标使其真正放下，就会执行类似这样的操作(伪代码)：

Public Function fire_the_great_event()
  x = the id of the element that just got dropped
  'do work here
  'take that element id, figure out what it is, and ask the database for more help
  'depending on what the database says, start deleting un-needed image/label/label's
End Function

任何形式的帮助都将不胜感激！如果可能的话，我希望将我与非VB/ASP的交互保持在最低限度。如果我能以某种方式从我的vb编码窗口给一个对象加上一个神奇的属性，那将是最好的。

谢谢!帐单

Answer 1

我想通了！我所要做的就是确保cssclass可以使用Jquery通过javascript拖拽。将.draggable应用于类，并确保这段js位于页面中而不是页面中。我还了解到，我在表格格式中创建控件的方法似乎不起作用，我必须将一个容器面板放在我想要的控件的位置，然后将它们单独添加到面板中。效果很好！