如何使用带单选按钮的 AJAX post 方法将详细类列表绑定到 gridview？

Question

我有一个带有列和单选按钮的网格，我想使用 Ajax Post 方法将数据绑定到它。但是当我这样做时，单选按钮消失了.. 我想将列表显示到 gridview 中，每行都有 radionbutton 以供选择。

$(document).ready(function () {
            BindGridView();

        });

        function BindGridView() {

            $.ajax({
                type: "POST",
                url: "CultureHeritage.aspx/GetData",
                contentType: "application/json;charset=utf-8",
                data: {},
                dataType: "json",
                success: function (data) {
                    
                    alert(data.d); //list is here..complete table
                    

                    if (data.d.length > 0) {
                        
                        for (var i = 0; i < data.d.length; i++) {

                            $("#carServiceGridView").append("<tr><td></td> <td>" +
                            data.d[i].CarServiceId + "</td> <td>" +
                            data.d[i].CarServiceName + "</td> <td>" +
                            data.d[i].Address + "</td> <td>" +
                            data.d[i].Contact1 + "</td><td>" +
                            data.d[i].Contact2 + "</td><td>" +
                            data.d[i].MinimumPrice + "</td><td>" +
                            data.d[i].MaximumPrice + "</td><td>" +
                            data.d[i].NoOfCar + "</td><td>" +
                            data.d[i].CarType + "</td></tr>");
                        }
                    }
                },
                error: function (result) {
                    //alert("Error login");

                }
            });
        }

<asp:GridView ID="carServiceGridView" runat="server" ClientIDMode="Static" AutoGenerateColumns="False" DataKeyNames="CarServiceId" Width="100%" Height="100%" AlternatingRowStyle-BackColor="WhiteSmoke">

                <Columns>
                      <asp:TemplateField  HeaderText="Select">
                <ItemTemplate>
                    <asp:RadioButton ID="carServiceGridViewRadioButton" runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
               
                    <asp:BoundField DataField="CarServiceId" HeaderText="Id  " />
                    <asp:BoundField DataField="CarServiceName" HeaderText="Service  " />
                    <asp:BoundField DataField="Address" HeaderText="Address  " />
                    <asp:BoundField DataField="Contact1" HeaderText="Contact 1  " />
                    <asp:BoundField DataField="Contact2" HeaderText="Contact 2  " />
                    <asp:BoundField DataField="MinimumPrice" HeaderText="Minimum Price  " />
                    <asp:BoundField DataField="MaximumPrice" HeaderText="Maximum Price  " />
                    <asp:BoundField DataField="NoOfCar" HeaderText="No Of Car  " />
                    <asp:BoundField DataField="CarType" HeaderText="Car Types  " />
                </Columns>
            </asp:GridView>

Answer 1

当您是 appending 中的 girdview 中的 success 中的 rows 中的 ajax 时，您需要添加 radio 按钮。

当前，当您添加行时，您添加的是空的 td，因此不会显示任何单选按钮。

试试这个

$("#carServiceGridView").append("<tr><td><input type='radio' value='someValue' id='carServiceGridViewRadioButton"+i+"' onchange='RadioButtonSelectOne(this)' /></td> <td>" +
                        data.d[i].CarServiceId + "</td> <td>" +
                        data.d[i].CarServiceName + "</td> <td>" +
                        data.d[i].Address + "</td> <td>" +
                        data.d[i].Contact1 + "</td><td>" +
                        data.d[i].Contact2 + "</td><td>" +
                        data.d[i].MinimumPrice + "</td><td>" +
                        data.d[i].MaximumPrice + "</td><td>" +
                        data.d[i].NoOfCar + "</td><td>" +
                        data.d[i].CarType + "</td></tr>");

如何使用带单选按钮的 AJAX post 方法将详细类列表绑定到 gridview？

how can I bind detailClass list to gridview using AJX post method with a radio button?

javascript

c#

asp.net

jquery

gridview