在ASP.Net中的ListView中拖放項目

我有一個列表視圖顯示圖像像ImageViewer，我想在ListView中實現拖放行爲。請讓我知道如何在下面這種定製的ListView中實現Srag-Drop。在ASP.Net中的ListView中拖放項目

<asp:ListView ID="lvPhotoViewer" runat="server" GroupItemCount="3" InsertItemPosition="LastItem"> 
    <LayoutTemplate> 
     <table id="groupPlaceholderContainer" runat="server" border="1"> 
      <tr id="groupPlaceholder" runat="server"> 
      </tr> 
     </table> 
    </LayoutTemplate> 
    <ItemTemplate> 
     <td id="Td4" align="center" style="background-color: #eeeeee;"> 
      <asp:Image runat="server" ID="imPhoto" Height="100px" Width="100px" ImageUrl='<%# "~"+Eval("PhotoUrl") %>' /> 
      <br /> 
      <asp:Label ID="DefaultPhotIDLabel" runat="server" Text='<%# Eval("PhotoName") %>' /> 
     </td> 
    </ItemTemplate> 
    <GroupTemplate> 
     <tr id="itemPlaceholderContainer" runat="server"> 
      <td id="itemPlaceholder" runat="server"> 
      </td> 
     </tr> 
    </GroupTemplate> 
    <InsertItemTemplate> 
     <td id="Td3" width="150px" height="150px" runat="server" align="center" style="background-color: #e8e8e8; 
      color: #333333;"> 
      <asp:FileUpload ID="fileUpload" runat="server" /> 
     </td> 
    </InsertItemTemplate> 
</asp:ListView>

代碼背後：

public class ImageEntity 
{ 
    public string PhotoName { get; set; } 
    public int PhotoIndex { get; set; } 
    public string PhotoURL { get; set; } 
} 


public partial class _Default : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     IList<ImageEntity> imagesList = new List<ImageEntity>() 
     { 
      new ImageEntity(){ PhotoName="House1", PhotoIndex=1, PhotoURL= @"\Images\House-01.JPG" }, 
      new ImageEntity(){ PhotoName="House2", PhotoIndex=2, PhotoURL= @"\Images\House-05.JPG" }, 
      new ImageEntity(){ PhotoName="House3", PhotoIndex=3, PhotoURL= @"\Images\house.jpg" }, 
      new ImageEntity(){ PhotoName="House4", PhotoIndex=4, PhotoURL= @"\Images\house2.jpg" } 
     }; 

     lvPhotoViewer.DataSource = imagesList; 
     lvPhotoViewer.DataBind(); 
    } 
}

請給我建議的方式來實現的ListView

來源

2011-03-11 CHash_Mike

你想拖放...什麼？哪裏？你想排序的圖像，或..？ – 2011-03-11 15:08:30

我有一個listview控件，裏面我使用ItemTemplate顯示圖像。現在我想Draog將這些圖像放在自己內部，以重新排列列表視圖中的圖像。我想使用拖放重新排序圖像。 – 2011-03-13 04:22:27

考慮使用jQuery拖內拖放的圖像/下降UI功能：http://jqueryui.com/demos/draggable/和http://jqueryui.com/demos/droppable/ 。

另外，如果你想拖/放行，檢查了這一點：jQuery draggable table elements

HTH。

來源

2011-03-11 15:35:01

感謝大腦..解決方案看起來很完美，但小示範應用程序真的有幫助。我對JQuery非常陌生，所以如果可能的話，請你指點一個示例應用程序，其中Listview中的圖像可以被拖放？ – 2011-03-13 04:19:34

大腦，你給出的鏈接確實有幫助。我能夠用它實現Drag-dRop功能.. – 2011-03-19 03:59:21

在ASP.Net中的ListView中拖放項目

回答

相關問題