數據綁定到客戶端的GridView

Question

我正在嘗試將數據綁定到客戶端的gridview上。 下面是我嘗試過的js。 它的工作，但在第二次單擊按鈕時，所有行的值都會更改。

function databind(response) {
        var xmlDoc = $.parseXML(response);
        var xml = $(xmlDoc);
        var Positions = xml.find("Table");
        var row = $("[id*=gridview] tr:last-child");
        $("[id*=gridview] tr").not($("[id*=gridview] tr:first-child")).remove();
        $.each(Positions, function () {
            var Position = $(this);
              $("td", row).eq(0).html('<a id="lkedit" style="font-weight:bold;text-decoration:underline;cursor:pointer;color:Blue; ">Edit</a>');
              $("td", row).eq(1).html('<a id="lkdelete" onclick="SingleDel(this)" style="font-weight:bold;text-decoration:underline;cursor:pointer;color:Blue; ">Delete</a>');

              $("td", row).eq(2).html('<input type="checkbox" onclick="javascript:Selectchildcheckboxes();" id="chkRow"/>');
              $("td", row).eq(3).html('<span id="lblpfid">'+Position.find("pfid").text()+'<span/>');

              $("td", row).eq(4).html('<span id="lblpfname">'+Position.find("pfname").text()+'<span/>');

              $("td", row).eq(5).html('<span id="lblposid">'+Position.find("positionid").text()+'<span/>');

              $("td", row).eq(6).html('<span id="lbldisposid">'+Position.find("disposid").text()+'<span/>');//DataItem.disposid
              $("td", row).eq(7).html('<span id="lbltype">'+Position.find("type").text()+'<span/>');      //type

              $("td", row).eq(8).html('<span id="lblcur">'+Position.find("ccy").text()+'<span/>');     //ccy
           $("[id*=gridview]").append(row);
           row = $("[id*=gridview] tr:last-child").clone(true);
        });
}

在頁面加載時，將向網格添加一個空行。

我的page_load方法是

 Sub Page_load()
      BindDummyRow
 End Sub
 Private Sub BindDummyRow()
    Dim dummy As New DataTable()

    dummy.Columns.Add("pfid")
    dummy.Columns.Add("pfname")
    dummy.Columns.Add("positionid")
    dummy.Columns.Add("disposid")
    dummy.Columns.Add("type")
    dummy.Columns.Add("ccy")
    dummy.Rows.Add()
    gridview.DataSource = dummy
    gridview.DataBind()
End Sub

我不知道錯誤發生在哪里。

Answer 1

進行如下更改。 您已經說過添加了額外的一行，因為克隆了最后一個孩子。因此將last-child更改為last.command最后一行。

function databind(response) {
    var xmlDoc = $.parseXML(response);
    var xml = $(xmlDoc);
    var Positions = xml.find("Table");
    var row = $("[id*=gridview] tr:last"); 
    $("[id*=gridview] tr").not($("[id*=gridview] tr:first-child")).remove();
    $.each(Positions, function () {
        var Position = $(this);
          $("td", row).eq(0).html('<a id="lkedit" style="font-weight:bold;text-decoration:underline;cursor:pointer;color:Blue; ">Edit</a>');
          $("td", row).eq(1).html('<a id="lkdelete" onclick="SingleDel(this)" style="font-weight:bold;text-decoration:underline;cursor:pointer;color:Blue; ">Delete</a>');

          $("td", row).eq(2).html('<input type="checkbox" onclick="javascript:Selectchildcheckboxes();" id="chkRow"/>');
          $("td", row).eq(3).html('<span id="lblpfid">'+Position.find("pfid").text()+'<span/>');

          $("td", row).eq(4).html('<span id="lblpfname">'+Position.find("pfname").text()+'<span/>');

          $("td", row).eq(5).html('<span id="lblposid">'+Position.find("positionid").text()+'<span/>');

          $("td", row).eq(6).html('<span id="lbldisposid">'+Position.find("disposid").text()+'<span/>');//DataItem.disposid
          $("td", row).eq(7).html('<span id="lbltype">'+Position.find("type").text()+'<span/>');      //type

          $("td", row).eq(8).html('<span id="lblcur">'+Position.find("ccy").text()+'<span/>');     //ccy
       $("[id*=gridview]").append(row);
      // row = $("[id*=gridview] tr:last-child").clone(true);
    });
}