我有一个ASP.net站点,其中有一个名为DisplayPersons的方法,它列出了数据库中的所有人员。事情是,当我点击ShowUsers按钮时,它调用DisplayPersons函数并将数据绑定到gridview并正常工作。当我第二次单击该按钮时,它会通过重复数据将数据复制到网格视图。 我想要的是,如果单击ShowUsers按钮,它只需要显示数据库中存在的数据,而不管其点击的次数。请帮忙。请忽略其他功能
ASPX:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
function SavePersonRecord() {
var Name = $.trim($('#<%=txtName.ClientID %>').val());
var LName = $.trim($('#<%=txtLastName.ClientID %>').val());
var Messege = "";
if (Name == '') {
Messege = "FirstName is blank ";
}
if (LName == '') {
Messege += "LastName is Blank";
}
if (Messege.length == 0) {
$.ajax({
type: "POST",
dataType: "json",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/InsertPersonRecord",
data: "{'Name':'" + Name + "', 'LName':'" + LName + "'}",
success: function (Record) {
$('#txtName').val();
$('#txtLastName').val();
if (Record.d == true) {
$('#Result').text("Your Record has been inserted successfuly");
$('#txtName').val('');
$('#txtLastName').val('');
}
else {
$('#Result').text("Your Record was Not Inserted");
}
},
Error: function (textMsg) {
$('#Result').text("Error: " + Error);
}
});
}
else {
$('#Result').html('');
$('#Result').html(Messege);
}
$('#Result').fadeIn();
}
function DisplayPersons() {
//document.write("a");
$("#gvData").val('');
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/BindUsers",
data: "{}",
dataType: "json",
success: function (result) {
for (var i = 0; i < result.d.length; i++) {
$("#gvData").append("<tr><td>" + result.d[i].FirstName + "</td><td>" + result.d[i].LastName);
result.d[i] = null;
}
},
error: function (result) {
alert("Error");
}
});
}
function SearchData()
{
var search = $.trim($('#<%=txtserach.ClientID %>').val());
if (search == "") {
return;
}
$.ajax({
type: "POST",
dataType: "json",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/Search",
data: "{'term':'" + search + "'}",
success: function (found) {
for (var i = 0; i < found.d.length; i++) {
$("#gvData").append("<tr><td>" + found.d[i].FirstName + "</td><td>" + found.d[i].LastName);
found.d[i] = null;
}
}
});
}
</script>
<h3 id="Result"></h3>
<form id="form1" runat="server">
<div>
<asp:Table ID="Table1" runat="server">
<asp:TableRow>
<asp:TableCell>FirstName </asp:TableCell><asp:TableCell>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell>Last Name</asp:TableCell><asp:TableCell>
<asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell></asp:TableCell><asp:TableCell>
<asp:Button ID="btnInsertRecord" runat="server" Text="Save" OnClientClick="SavePersonRecord(); return false" />
</asp:TableCell>
<asp:TableCell><input type="button" value="Show Users" onclick="DisplayPersons()" /></asp:TableCell>
</asp:TableRow>
</asp:Table>
<br /><br />
<asp:TextBox ID="txtserach" runat="server"></asp:TextBox>
<input type="button" value="Search" onclick="SearchData()" />
<asp:GridView ID="gvData" runat="server" CellPadding="4" ShowHeaderWhenEmpty="true" ForeColor="#333333">
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#EFF3FB" />
</asp:GridView>
</div>
</form>
</body>
</html>
CS文件:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Configuration;
using System.Data.SqlClient;
using System.Data;
using System.Web.Services;
public partial class _Default : System.Web.UI.Page
{
static string conString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
static List<Users> allUsers;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindToGrid();
}
}
[WebMethod]
public static bool InsertPersonRecord(string Name, string LName)
{
bool InsertData;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand("sp_PersonData", con))
{
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@FName", Name);
cmd.Parameters.AddWithValue("@LName", LName);
if (con.State == ConnectionState.Closed)
{
con.Open();
}
int Result = cmd.ExecuteNonQuery();
if (Result > 0)
{
InsertData = true;
}
else
{
InsertData = false;
}
return InsertData;
}
}
}
[WebMethod]
public static List<Users> BindUsers()
{
DataTable dt = new DataTable();
allUsers = new List<Users>();
allUsers.Clear();
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand command = new SqlCommand("select FirstName, LastName from Users Order By FirstName", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(command);
da.Fill(dt);
foreach (DataRow dtrow in dt.Rows)
{
Users users = new Users();
users.FirstName = dtrow["FirstName"].ToString();
users.LastName = dtrow["LastName"].ToString();
allUsers.Add(users);
}
}
}
return allUsers;
}
[WebMethod]
public static List<Users> Search(string term)
{
//List<Users> result = new List<Users>();
return allUsers.FindAll(x => x.FirstName.Contains("term"));
}
public void BindToGrid()
{
DataTable dt = new DataTable();
dt.Columns.Add("FirstName");
dt.Columns.Add("LastName");
gvData.DataSource = dt;
gvData.DataBind();
}
}
public class Users
{
public string FirstName { get; set; }
public string LastName { get; set; }
}
答案 0 :(得分:0)
您需要使用html('')
清除网格视图,而不是val('')
。
function DisplayPersons() {
$("#gvData").html('');
// Removed for brevity.
}
方法val()
仅适用于表单输入,如jQuery docs中所述:
.val()
方法主要用于获取表单元素的值,例如input
,select
和textarea
。
但是,html()
works如果你想获取/设置任何元素的内容。
当
.html()
用于设置元素的内容时,该元素中的所有内容都将被新内容完全替换。