Json.I를 사용하여 Gridview를 바인딩합니다. 내 페이지에서 한 개의 텍스트 상자, 검색 버튼 및 하나의 gridview를 추가했습니다. 그 시점에로드 된 페이지는 모든 데이터가 Gridview.and에 바인딩됩니다. 텍스트 상자에 텍스트 입력 후 검색 버튼을 클릭하면 검색 결과가 표시되지만 모든 데이터가 포함 된 검색 결과 데이터가 추가됩니다. 검색 결과 데이터를 바인딩하기 만하면됩니다.Json 데이터를 사용하여 바인딩 된 Gridview에 대한 #
내 코드는
.aspx 페이지
<table>
<tr>
<td>
<asp:TextBox ID="txtSearch" runat="server"></asp:TextBox>
</td>
<td>
<asp:Button ID="btnSearch" runat="server" Text="Search" />
</td>
</tr>
<tr>
<td colspan="2">
<asp:GridView ID="gvDetails" runat="server">
<HeaderStyle BackColor="#DC5807" Font-Bold="true" ForeColor="White" />
</asp:GridView>
</td>
</tr>
</table>
이제 스크립트는이
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// function() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Gridview.aspx/BindDatatable",
async: true,
cache: false,
data: "{}",
dataType: "json",
success: function (data) {
for (var i = 0; i < data.d.length; i++) {
$("#gvDetails").append("<tr><td>" + data.d[i].OfficeName + "</td><td>" + data.d[i].City + "</td><td>" + data.d[i].Country + "</td></tr>");
}
},
error: function (result) {
alert("Error");
}
});
$('#btnSearch').click
(
function() {
var searchtext = $("#txtSearch").val();
alert(searchtext);
$.ajax(
{
type: "POST",
url: "Gridview.aspx/BindSearchDatatable",
//data: "{officename : '"+searchtext+"'}",
data: JSON.stringify({ officename: searchtext }),
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
cache: false,
success: function (data) {
for (var i = 0; i < data.d.length; i++) {
$("#gvDetails").append("<tr><td>" + data.d[i].OfficeName + "</td><td>" + data.d[i].City + "</td><td>" + data.d[i].Country + "</td></tr>");
}
},
error: function (x, e) {
alert("The call to the server side failed. " + x.responseText);
}
}
);
return false;
}
);
// }
});
</script>
이제 .aspx.cs 페이지 코드처럼
public partial class Gridview : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindColumnToGridview();
}
}
private void BindColumnToGridview()
{
DataTable dt = new DataTable();
dt.Columns.Add("OfficeName");
dt.Columns.Add("City");
dt.Columns.Add("Country");
dt.Rows.Add();
gvDetails.DataSource = dt;
gvDetails.DataBind();
gvDetails.Rows[0].Visible = false;
}
[WebMethod]
public static OfficeDetails[] BindDatatable()
{
DataTable dt = new DataTable();
List<OfficeDetails> details = new List<OfficeDetails>();
using (SqlConnection con = new SqlConnection(@"Data Source=kartikpatel\SQLEXPRESS;Initial Catalog=master;Integrated Security=True"))
{
using (SqlCommand cmd = new SqlCommand("select OfficeName,City,Country from Office", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
foreach (DataRow dtrow in dt.Rows)
{
OfficeDetails Office = new OfficeDetails();
Office.OfficeName = dtrow["OfficeName"].ToString();
Office.City = dtrow["City"].ToString();
Office.Country = dtrow["Country"].ToString();
details.Add(Office);
}
}
}
return details.ToArray();
}
[WebMethod]
public static OfficeDetails[] BindSearchDatatable(string officename)
{
DataTable dt = new DataTable();
List<OfficeDetails> details = new List<OfficeDetails>();
using (SqlConnection con = new SqlConnection(@"Data Source=kartikpatel\SQLEXPRESS;Initial Catalog=master;Integrated Security=True"))
{
using (SqlCommand cmd = new SqlCommand("select OfficeName,City,Country from Office where OfficeName like '%" + officename + "%'", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
foreach (DataRow dtrow in dt.Rows)
{
OfficeDetails Office = new OfficeDetails();
Office.OfficeName = dtrow["OfficeName"].ToString();
Office.City = dtrow["City"].ToString();
Office.Country = dtrow["Country"].ToString();
details.Add(Office);
}
}
}
return details.ToArray();
}
public class OfficeDetails
{
public string OfficeName { get; set; }
public string City { get; set; }
public string Country { get; set; }
}
}
당신이 볼 경우 나는 그것을 왜 사용 했는가? ch 결과는 모든 data.but와 함께 추가됩니다. 검색 결과 만 원하는 경우 검색 버튼을 클릭합니다. Google에서 검색했지만 아무 것도받지 못했습니다. 제발 도와주세요.
가 정확한 데이터를 얻을나요 항상 볼 수 할 제안? – StrouMfios
예 올바른 데이터를 얻었습니다 –
문제를 완전히 이해했는지 모르겠지만 for 루프 전에 gvDetails를 지우십시오. $ ("# gvDetails"). empty(); – StrouMfios