C# 使用jquery在ASP.NET web表单中的数据插入上显示中继器，无需回发

这似乎很简单，但我就是搞不懂。 我有一个asp.net页面，具有以下凭据：

1按钮

1文本框

1中继器

*现在，当我在文本框中键入文本时，我使用jquery ajax将文本传递给web方法， 将文本插入数据库。 现在我的代码中有了一个公共方法，thta从数据库中选择数据并将其绑定到中继器。 在没有回发的情况下，如何在每次数据插入时显示此中继器？*

 success: function (data) {
            for (var i = 0; i < data.d.length; i++) {
                $("#tbDetails").append("<tr><td>" + data.d[i].ID + "</td><td>" + data.d[i].ChargeName + "</td><td>" + data.d[i].Description + "</td></tr>");
            }
        },
        error: function (result) {
            alert("Error");

成功：函数（数据）{
对于（变量i=0；i

这是一个小示例，我想你可以忽略插入部分，因为你说你已经有了它。它使用jQuery，你也在使用它

HTML:

函数insertData（）{
$.ajax({
类型：“POST”，
contentType:“应用程序/json；字符集=utf-8”，
url:“Default.aspx/insertData”，
数据：“{}”，
数据类型：“json”，
成功：功能（数据）{
if（data.d！=null）
警报（数据d）；
}
});
}
函数retrieveData（）{
$.ajax({
类型：“POST”，
contentType:“应用程序/json；字符集=utf-8”，
url:“Default.aspx/retrieveData”，
数据：“{}”，
数据类型：“json”，
成功：功能（数据）{
if（data.d！=null）{
对于（i=0；i

ASP.NET：

using System;
using System.Web.Services;
using System.Collections.Generic;

public partial class _Default : System.Web.UI.Page
{

    [WebMethod]
    public static List<SampleClass> retrieveData()
    {
        //Retrieve data from the server and return.
        List<SampleClass> tmp = new List<SampleClass>();

        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 1", Age = 44, ID = 1 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 2", Age = 23, ID = 2 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 3", Age = 20, ID = 3 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 4", Age = 45, ID = 4 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 5", Age = 21, ID = 5 });

        return tmp;
    }

    [WebMethod]
    public static bool deleteRow(int row)
     {
        if (row > 0)
            return true;

        return false;
    }

    [WebMethod]
    public static bool insertData()
    {
        //Do all of the insert in the server blah blah blah
        //and return true or false if it was inserted.
        return true;

    }
}

public class SampleClass
{
    public int ID { get; set; }
    public string Name { get; set; }
    public string LastName { get; set; }
    public int Age { get; set; }
}

使用系统；
使用System.Web.Services；
使用System.Collections.Generic；
公共部分类\u默认值：System.Web.UI.Page
{
[网络方法]
公共静态列表检索数据（）
{
//从服务器检索数据并返回。
List tmp=新列表（）；
添加（newsampleclass（）{Name=“Test”，LastName=“Number 1”，Age=44，ID=1}）；
添加（newsampleclass（）{Name=“Test”，LastName=“Number 2”，Age=23，ID=2}）；
添加（newsampleclass（）{Name=“Test”，LastName=“Number 3”，Age=20，ID=3}）；
添加（newsampleclass（）{Name=“Test”，LastName=“Number 4”，Age=45，ID=4}）；
添加（newsampleclass（）{Name=“Test”，LastName=“Number 5”，Age=21，ID=5}）；
返回tmp；
}
[网络方法]
公共静态bool deleteRow（int行）
{
如果（行>0）
返回true；
返回false；
}
[网络方法]
公共静态bool insertData（）
{
//在服务器上做所有的插入等等等等
//如果插入，则返回true或false。
返回true；
}
}
公共类样本类
{
公共int ID{get；set；}
公共字符串名称{get；set；}
公共字符串LastName{get；set；}
公共整数{get；set；}
}

祝你好运！

---

编辑：现在您还可以看到一个删除示例，其中包括将一个参数传递给webmethod。祝您好运。

CAPS LOCK使所有内容都更易于阅读。为什么要使用asp.net服务器控件来显示数据？您是否可以执行另一个jquery ajax调用，然后在html中显示它？@hanlet hmm…。我该怎么做？我正在一个小型sa中工作mple，并将其作为答案发布。@hanlet…感谢提供详细信息…但在retrieveData web方法中，我想返回一个转发器（而不仅仅是字符串）…即一个从数据库获取数据并在UI中显示的查询。您想返回一个转发器吗？我不理解这一部分。您从数据库中到底得到了什么？Datatable，什么东西的列表？data.d对象是一个json对象，它可以包含几乎任何强类型对象或Datatable。我将创建一个强类型对象对象并修改我的示例，以便您可以看到我所说的内容。@hanlet…正在从数据库中的表返回数据…但我将其绑定到代码隐藏中的一个转发器。@froodo，我对代码进行了一些更新，以向您展示如何从代码隐藏中返回强类型对象并在html上显示它。现在，我知道您是databi正在将数据绑定到中继器，但您到底绑定到中继器的是什么？数据表、对象的通用列表、字符串列表？如果您提供更多信息，我可能会为您提供更详细的示例。

using System;
using System.Web.Services;
using System.Collections.Generic;

public partial class _Default : System.Web.UI.Page
{

    [WebMethod]
    public static List<SampleClass> retrieveData()
    {
        //Retrieve data from the server and return.
        List<SampleClass> tmp = new List<SampleClass>();

        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 1", Age = 44, ID = 1 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 2", Age = 23, ID = 2 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 3", Age = 20, ID = 3 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 4", Age = 45, ID = 4 });
        tmp.Add(new SampleClass() { Name = "Test", LastName = "Number 5", Age = 21, ID = 5 });

        return tmp;
    }

    [WebMethod]
    public static bool deleteRow(int row)
     {
        if (row > 0)
            return true;

        return false;
    }

    [WebMethod]
    public static bool insertData()
    {
        //Do all of the insert in the server blah blah blah
        //and return true or false if it was inserted.
        return true;

    }
}

public class SampleClass
{
    public int ID { get; set; }
    public string Name { get; set; }
    public string LastName { get; set; }
    public int Age { get; set; }
}