About repeater in asp.net (javascript)

C# Corner

Jon John

5y927Learn iOS Programming

How to load data in repeater using javascript ??

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

Sachin Singh5y ago
Accepted answer
Follow below example , we mark the method as WebMethod to be called by javascript and loop through the result to bind result.
"dvCustomers">
    "rptCustomers" runat="server">

                "tblCustomer" cellpadding="2" cellspacing="0" border="1">


                        "name">
                            <%# Eval("ContactName") %>




                        City: "city"><%# Eval("City") %>
                        Postal Code: "postal"><%# Eval("PostalCode") %>
                        Country: "country"><%# Eval("Country")%>
                        Phone: "phone"><%# Eval("Phone")%>
                        Fax: "fax"><%# Eval("Fax")%>
public class Customer
{
public string CustomerId { get; set; }
public string ContactName { get; set; }
public string City { get; set; }
public string Country { get; set; }
public string PostalCode { get; set; }
public string Phone { get; set; }
public string Fax { get; set; }
}
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
List customers = new List();
customers.Add(new Customer());
rptCustomers.DataSource = customers;
rptCustomers.DataBind();
}
}
[WebMethod]
public static List GetCustomers()
{
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("SELECT TOP 10 * FROM Customers"))
{
cmd.Connection = con;
List customers = new List();
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
customers.Add(new Customer
{
CustomerId = sdr["CustomerId"].ToString(),
ContactName = sdr["ContactName"].ToString(),
City = sdr["City"].ToString(),
Country = sdr["Country"].ToString(),
PostalCode = sdr["PostalCode"].ToString(),
Phone = sdr["Phone"].ToString(),
Fax = sdr["Fax"].ToString(),
});
}
}
con.Close();
return customers;
}
}
}
"text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
"text/javascript">
$(function () {
$.ajax({
type: "POST",
url: "Default.aspx/GetCustomers",
data: '{}',
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 table = $("#dvCustomers table").eq(0).clone(true);
var customers = response.d;
$("#dvCustomers table").eq(0).remove();
$(customers).each(function () {
$(".name", table).html(this.ContactName);
$(".city", table).html(this.City);
$(".postal", table).html(this.PostalCode);
$(".country", table).html(this.Country);
$(".phone", table).html(this.Phone);
$(".fax", table).html(this.Fax);
$("#dvCustomers").append(table).append("");
table = $("#dvCustomers table").eq(0).clone(true);
});
}

Shantanu Pandey5y ago

you can refer following article:

https://www.aspsnippets.com/Articles/Populate-ASPNet-Repeater-by-binding-DataSet-Client-Side-using-jQuery-AJAX.aspx

https://www.c-sharpcorner.com/article/iteration-of-repeater-using-javascript/