且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何在jQuery中绑定数据列表

更新时间:2023-12-06 12:07:28

这是我的代码,请检查您的代码并进行适当的更改并获得答案

here is my code pls check with your code and make appropriate changes and get answer

<asp:DataList ID="dlCustomers" runat="server" RepeatLayout="Table" RepeatColumns="3"
                            CellPadding="3" CellSpacing="3" HeaderStyle-VerticalAlign="Top">
                            <ItemStyle HorizontalAlign="Center" />
                            <ItemTemplate>
                                <table cellpadding="3" cellspacing="3" border="1" style="width: 310px; height: 100px; border: thin 2px #428bca; color: black; background-color: #EEEEEE">
                                    <tr>
                                        <td style="text-align: center; background-color: cyan; color: black">
                                            <b><span class="plot"><%# Eval("PlotNumber") %> </span></b>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Seasoncode:<span class="Season"><%# Eval("Seasoncode") %> </span>
                                            <br />
                                            Village: <span class="Village"><%# Eval("Village") %></span><br />
                                            Planting Date: <span class="PlantingDate"><%# Eval("PlantingDate")%></span><br />
                                            Plant: <span class="Planttype"><%# Eval("Planttype")%></span> &nbsp;&nbsp;
                                            Crop: <span class="CropType"><%# Eval("CropType")%></span> &nbsp;&nbsp;
                                            Nursery: <span class="NurseryType"><%# Eval("NurseryType")%></span><br />
                                            Cutas Setts: <span class="CutasSetts"><%# Eval("CutasSetts")%></span><br />
                                            Seed Supply: <span class="SeedSupply"><%# Eval("SeedSupply")%></span><br />
                                            Cutas Bulk: <span class="CutasBulk"><%# Eval("CutasBulk")%></span><br />
                                            Cane Supply: <span class="CaneSupply"><%# Eval("CaneSupply")%></span><br />
                                        </td>
                                    </tr>
                                </table>
                            </ItemTemplate>
                        </asp:DataList>

jQuery代码:-

function plot_details(paramstr) {
            $("[id*=dlCustomers]").hide();

            $.ajax({
                type: "POST",
                url: "CommonView.aspx/GetCustomers",
                data: "{'paramstr': '" + paramstr + "', 'procname': '" + 'DBSP_Get_PartyPlotView' + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: OnSuccess,
                failure: function (response) {
                    alert(response.d);
                },
                error: function (response) {
                    alert(response.d);
                }
            });
        }

        function OnSuccess(response) {
            var xmlDoc = $.parseXML(response.d);
            var xml = $(xmlDoc);
            var customers = xml.find("Table");
            var repeatColumns = parseInt("<%=dlCustomers.RepeatColumns == 0 ? 1 : dlCustomers.RepeatColumns %>");
            var rowCount = Math.ceil(customers.length / repeatColumns);
            var i = 0;

            while (i < repeatColumns * rowCount) {
                var row = $("[id*=dlCustomers] tr").eq(0).clone(true);
                for (var j = 0; j < repeatColumns; j++) {
                    var customer = $(customers[i]);
                    if (customer.length == 0) {
                        $("table:last", row).remove();
                    } else {
                        $(".plot", row).eq(j).html(customer.find("PlotNumber").text());
                        $(".Season", row).eq(j).html(customer.find("Seasoncode").text());
                        $(".Village", row).eq(j).html(customer.find("Village").text());
                        $(".PlantingDate", row).eq(j).html(customer.find("PlantingDate").text());
                        $(".Planttype", row).eq(j).html(customer.find("Planttype").text());
                        $(".CropType", row).eq(j).html(customer.find("CropType").text());

                        $(".NurseryType", row).eq(j).html(customer.find("NurseryType").text());
                        $(".Variety", row).eq(j).html(customer.find("Variety").text());
                        $(".CutasSetts", row).eq(j).html(customer.find("CutasSetts").text());
                        $(".CutasBulk", row).eq(j).html(customer.find("CutasBulk").text());
                        $(".SeedSupply", row).eq(j).html(customer.find("SeedSupply").text());
                        $(".CaneSupply", row).eq(j).html(customer.find("CaneSupply").text());
                    }
                    i++;
                }
                $("[id*=dlCustomers]").append(row);
            }
            $("[id*=dlCustomers] tr").eq(0).remove();
            $("[id*=dlCustomers]").show();
        }