如何使listview项拖放。 [英] How to make listview item drag and drop.

问题描述

创建列表视图并绑定到Radlist视图。单击列表视图项时，我可以将文本框控件插入到表格单元格中（动态生成表格），实际上我必须拖动列表视图项目并将控件放入表格单元格中。在这种情况下，我将文本框控件插入零索引。有人可以帮帮我，我该怎么办？



谢谢，问候。



注意：尝试像vs工具箱一样创建。



我尝试过：



脚本：

Creating a listview and bind to Radlist view. On clicking of listview item i am able insert the textbox control into a tablecell (generated table dynamically), actually i have to drag the listview item and drop the control into table cells. In this case i am inserting the textbox control at zero index. can someone help me out, how can i do this??

Thanks, regards.

Note: Trying to create same like vs toolbox.

What I have tried:

Script:

function GetDynamicTextBox(value) {
                    return '<input name = "DynamicTextBox" type="text" value = "' + value + '" />';

 function StepChange() {
                    var table = document.getElementById('myTable');
                    table.rows['0'].cells['0'].innerHTML = GetDynamicTextBox("");
                }
                function insertData() {
                    $find('<%=RadAjaxManager1.ClientID%>').ajaxRequest('InsertClick');
                }

加价：

Markup:

<telerik:RadListView ID="RadListView1" runat="server" RenderMode="Lightweight" ItemPlaceholderID="rLVItemContainer" ClientDataKeyNames="Sln,ControlName" DataKeyNames=" Sln,ControlName">
                    <LayoutTemplate>
                        <div id="itemContainer">
                            <asp:Panel ID="rLVItemContainer" runat="server">
                            </asp:Panel>
                        </div>
                    </LayoutTemplate>
                    <ItemTemplate>
                        <div id="divHighlight" class="ListViewStyle" onclick="StepChange();">
                            <div style="vertical-align: top; width: 100%">
                                <table>
                                    <tr id="tr1">
                                        <td colspan="2" class="tdnormal">
                                            <telerik:RadLabel ID="lbl1" runat="server" Text='<%# Bind("Sln")%>' Font-Bold="true" CssClass="ItemHeaderStyle"></telerik:RadLabel>
                                            <telerik:RadLabel ID="lbl2" runat="server" Text='<%# Bind("ControlName")%>' Font-Bold="true" CssClass="ItemHeaderStyle"></telerik:RadLabel>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </ItemTemplate>
                </telerik:RadListView>

CodeBehind：

CodeBehind:

public void BindListView()
        {
            DataTable dt = new DataTable();
            dt.Columns.Add("Sln");
            dt.Columns.Add("ControlName");
            dt.Rows.Add("1", "textbox");
            dt.Rows.Add("1", "combobox");
            dt.Rows.Add("1", "label");
            dt.Rows.Add("1", "ddl");
            dt.Rows.Add("1", "datetimepicker");
            RadListView1.DataSource = dt;
            RadListView1.DataBind();
        }

        protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
        {
             string commandText = e.Argument.ToString().Trim();
             switch (commandText)
             {
                 case "InsertClick":
                     RadScriptManager.RegisterClientScriptBlock(this, this.GetType(), "Script", "javascript:StepChange();", true);
                     break;
             }
        }

推荐答案

find（'<％= RadAjaxManager1.ClientID％> ; '）ajaxRequest（' InsertClick'）;
}

find('<%=RadAjaxManager1.ClientID%>').ajaxRequest('InsertClick'); }

加价：

Markup:

<telerik:RadListView ID="RadListView1" runat="server" RenderMode="Lightweight" ItemPlaceholderID="rLVItemContainer" ClientDataKeyNames="Sln,ControlName" DataKeyNames=" Sln,ControlName">
                    <LayoutTemplate>
                        <div id="itemContainer">
                            <asp:Panel ID="rLVItemContainer" runat="server">
                            </asp:Panel>
                        </div>
                    </LayoutTemplate>
                    <ItemTemplate>
                        <div id="divHighlight" class="ListViewStyle" onclick="StepChange();">
                            <div style="vertical-align: top; width: 100%">
                                <table>
                                    <tr id="tr1">
                                        <td colspan="2" class="tdnormal">
                                            <telerik:RadLabel ID="lbl1" runat="server" Text='<%# Bind("Sln")%>' Font-Bold="true" CssClass="ItemHeaderStyle"></telerik:RadLabel>
                                            <telerik:RadLabel ID="lbl2" runat="server" Text='<%# Bind("ControlName")%>' Font-Bold="true" CssClass="ItemHeaderStyle"></telerik:RadLabel>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </ItemTemplate>
                </telerik:RadListView>

CodeBehind：

CodeBehind:

public void BindListView()
        {
            DataTable dt = new DataTable();
            dt.Columns.Add("Sln");
            dt.Columns.Add("ControlName");
            dt.Rows.Add("1", "textbox");
            dt.Rows.Add("1", "combobox");
            dt.Rows.Add("1", "label");
            dt.Rows.Add("1", "ddl");
            dt.Rows.Add("1", "datetimepicker");
            RadListView1.DataSource = dt;
            RadListView1.DataBind();
        }

        protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
        {
             string commandText = e.Argument.ToString().Trim();
             switch (commandText)
             {
                 case "InsertClick":
                     RadScriptManager.RegisterClientScriptBlock(this, this.GetType(), "Script", "javascript:StepChange();", true);
                     break;
             }
        }

您好，



这里可能有一些人知道Telerik控件，但我相信你有更好的机会在Telerik专用论坛上发布它： Telerik Developer论坛 [ ^ ]

这篇关于如何使listview项拖放。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！