使用Jquery在Asp.net GridView中動態添加按鈕列

Question

我已經用json數據動態填充了Grid View ..Button列開始僅出現在第一行..而不出現在下面的行..

我已嘗試將代碼添加到服務器端代碼以及“標記”中的列中。我也進行搜索，但找不到任何相關內容

這是我的標記：

  <script type="text/javascript">
        $(document).ready(function () {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "List.aspx/GetData",
                data: "{}",
                dataType: "json",
                success: function (data) {
                    for (var i = 0; i < data.d.length; i++) {
                        $("#gvDetails").append("<tr><td>" + data.d[i].c1 + "</td><td>" + data.d[i].c2 + "</td><td>" + "</td></tr>");
                    }
                },
                error: function (result) {
                    alert(result.status + ' ' + result.statusText);
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="gvDetails" runat="server" ShowHeaderWhenEmpty="True">
            <Columns>
                <asp:ButtonField Text="Button" />
            </Columns>
        </asp:GridView>
    </div>
    </form>
</body>

這是背后的代碼：

 protected void Page_Load(object sender, EventArgs e)
        {
            BindColumnToGridview();
        }

        private void BindColumnToGridview()
        {
            DataTable dt = new DataTable();
            dt.Columns.Add("c1");
            dt.Columns.Add("c2");

            dt.Rows.Add();
            gvDetails.DataSource = dt;

            gvDetails.DataBind();

        }


        [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public static tbl1[] GetData()
        {

            try
            {
                using (var context = new TestDBContext())
                {
                    List<tbl1> lsTbl1 = new List<tbl1>();

                    lsTbl1 = (from c in context.tbl1 select c).ToList();
                    return lsTbl1.ToArray();

                }
            }
            catch (Exception)
            {

                throw;
            }

        }

我也試圖從后面的代碼中添加列

gvDetails.Columns.Add(new ButtonField() { Text = "Button"  });

這也不起作用

任何建議都將有所幫助

Answer 1

由於gvDetails是服務器端控件，因此應在JS代碼段中使用<%= gvDetails.ClientID %> 。

<script type="text/javascript">
        $(document).ready(function () {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "List.aspx/GetData",
                data: "{}",
                dataType: "json",
                success: function (data) {
                    for (var i = 0; i < data.d.length; i++) {
                        $("#<%= gvDetails.ClientID %>").append("<tr><td>" + data.d[i].c1 + "</td><td>" + data.d[i].c2 + "</td><td>" + "</td></tr>");
                    }
                },
                error: function (result) {
                    alert(result.status + ' ' + result.statusText);
                }
            });
        });
    </script>

編輯：

在此處輸入圖片說明

使用Jquery在Asp.net GridView中動態添加按鈕列

問題描述

1 個解決方案

解決方案1
1 2014-08-07 09:33:00

使用Jquery在Asp.net GridView中動態添加按鈕列

問題描述

1 個解決方案

解決方案1 1 2014-08-07 09:33:00

解決方案1
1 2014-08-07 09:33:00