Question

我从'table_source＆＃39;移动数据到＆＃39; table_dest＆＃39;，但＆＃39; table_source＆＃39;使用转发器创建并正确创建动态表ID。但是，我需要使用id =＆＃34; table_sourceX＆＃34;更改jquery函数更改（即table_source0变为table_source1）。我只是学习jquery并且知道这是hello world语句，但是这里有：

jquery的

 //moves from source to destination table            
             //$("#table_source").on('click', 'img.move-row', function (e) {
             var tableName = "#table_source" + repCounter.ToString()
             $(tableName).click(function (e) {                 
                 alert(tableName)
                 var tr = $(this).closest("tr").remove().clone();
                 tr.find("img.move-row")
        .attr("src", "remove_image_path.jpg")
        .attr("alt", "Remove");
                 $("#table_dest tbody").append(tr);
             });

//moves from destination back to source
                 $("#table_dest").on('click', 'img.move-row', function (e) {                 
                     var tr = $(this).closest("tr").remove().clone();
                     tr.find("img.move-row")
             .attr("src", "images/add.png")
             .attr("alt", "Move");
                     $("#table_source tbody").append(tr);
                 });

C＃

public int repCounter= 0;
        public string renderItem(RepeaterItem item)
        {
            object DI = item.DataItem;

            string MyVal = DataBinder.Eval(DI, "FirstName").ToString();



            string html = String.Empty;

            html = "<table id=" + "table_source" + repCounter.ToString() + " style=border: 1px solid black;border-collapse: separate;" +
    "border-spacing: 10px 50px;>" +
    "<tr>" +
    "<td>" + MyVal + "</td><td><img  alt='Move' class='move-row'id='arrowRotate' src='images/add.png' data-swap='images/minussymbol.jpg'/></td>" +
    "</tr>" +
    "</table>"; 

            repCounter++;

            return html;


  }

Answer 1

我不确定您是否只有两张桌子或多张桌子以及您尝试移动到哪张桌子，但我已经进行了未经考验的尝试。

首先，你应该把你的转发器连接好，不要动态创建它。

<asp:Repeater ID="rptTable" runat="server">
<ItemTemplate>
    <table data-id="<%# Container.ItemIndex %>" class="special-table" style="border: 1px solid black;border-collapse: separate; border-spacing: 10px 50px;">
        <tr>
            <td>
                <%#DataBinder.Eval(Container,"DataItem.FirstName") %>
            </td>
            <td>
                <img  alt="Move" class="move-row" id="arrowRotate" src="images/add.png" data-swap="images/minussymbol.jpg" />
            </td>
        </tr>
    </table>
</ItemTemplate>

然后尝试这个脚本。我毫不怀疑它可能需要对选择器进行一些调整，但它不应该太远。

<script type="text/javascript">
$(document).ready(function() {
    $('.special-table tr').click(function() {
        var row = $(this);

        var thisTable = row.closest('table');

        //all tables - should only be two for this
        var tables = $('.special-table');

        var otherTables = $.grep(tables, function (a) {
            return a.data('id') !== thisTable.data('id');
        });

        var otherTable = $(otherTables.first());

        row.appendTo(otherTable);
    });
});

让我知道你是怎么过的。

动态更改jquery

1 个答案: