OStack程序员社区-中国程序员成长平台 › 门户 ›编程› AJAX› AJAX编程经验 › 查看内容

ajax 服务器文本框自动填值

2022-2-5 17:01| 发布者: 菜鸟教程小白| 查看: 324| 评论: 0|原作者: [db:作者]|来自: [db:来源]

摘要: 最近二天。项目做完了。闲着没事做就自己写了一点东西。在写的过程中。发现利用服务器的文本框去查找用户的相关信息的时刻总要去刷新页面。

这样的话就增加了服务器的负担。后面自己他细想了一下。想利用ajax去实现这样一个效果。代码如下：
前台代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ServerTextBoxdata.aspx.cs" Inherits="Default3" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
<title>通过用户名自动填充用户其他信息</title> 
<script language="javascript" type="text/javascript" src="ajax/jquery.js"></script> 
<script language="javascript" type="text/javascript"> 
//获取用户名文本框的值 
function WritedataText() 
{ 
var username=$("#Txtusename").val(); 
if(username.length==0) 
{ 
alert("输入的用户名不能为空"); 
return ; 
} 
//执行通过用户名查找用户的相关信息 
$.ajax({ 
type:'POST', 
url:'ServerTextBoxdata.aspx', 
data:{action:'action',Username:username}, 
success:WritedataTextcallback 
}) 
} 
//通过用户名查找用户的相关信息的回调函数 
function WritedataTextcallback(r) 
{ 
if(r=="no") 
{ 
alert("输入的用户名不存在。请重新输入"); 
} 
else 
{ 
var data=r; 
var array=new Array(); 
array=data.split(","); 
//为文本框赋值 
$("#fullname").val(array[0]); 
$("#Email").val(array[1]); 
$("#mobilphone").val(array[2]); 
$("#qq").val(array[3]); 
} 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div align="center"> 
<table style="text-align:center;width:800px"> 
<tr style=" background-color:Yellow; width:800px"> 
<td colspan='2' style="text-align:center"> <font size="5" color="red">用户详细信息</font></td> 
</tr> 
<tr><td colspan='2' style=" text-align:left"> 用户名称：<asp:TextBox ID="Txtusename" runat="server"></asp:TextBox></td></tr> 
<tr><td style=" text-align:left;width:400px"> 用户全名：<asp:TextBox ID="fullname" runat="server" ReadOnly="true"></asp:TextBox></td><td style=" text-align:left; width:400px">用户邮箱：<asp:TextBox ID="Email" ReadOnly="true" runat="server"></asp:TextBox></td></tr> 
<tr><td style=" text-align:left;width:400px">手机号码：<asp:TextBox runat="server" ID="mobilphone" ReadOnly="true"></asp:TextBox></td><td style=" text-align:left; width:400px"> 
用户QQ &nbsp;：<asp:TextBox runat="server" ID="qq" ReadOnly="true"></asp:TextBox></td></tr> 
</table> 
</div> 
</form> 
</body> 
</html> 

后台代码：

复制代码代码如下:

using System; 
using System.Data; 
using System.Configuration; 
using System.Collections; 
using System.Web; 
using System.Web.Security; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using System.Web.UI.WebControls.WebParts; 
using System.Web.UI.HtmlControls; 
using System.Data.SqlClient; 
public partial class Default3 : System.Web.UI.Page 
{ 
string StrAction = ""; 
protected void Page_Load(object sender, EventArgs e) 
{ 
StrAction = Request["action"]; 
//为服务器控件添加失去焦点的事件 让服务器控件不刷新的关键 
Txtusename.Attributes.Add("onblur", "WritedataText()"); 
Txtusename.Focus(); 
if (StrAction == "action") 
{ 
//获取用户输入的名称 
string username = Request["Username"]; 
if (!Isusername(username)) 
{ 
Response.Clear(); 
Response.ContentType = "application/text"; 
Response.Write("no"); 
Response.End(); 
} 
else 
{ 
InitData(username); 
} 
} 
} 
/// <summary> 
/// 创建人：周昕 
/// 创建时间：2009-06-11 
/// 方法名称：InitData 
/// 作用：查找用户的详细信息 
/// </summary> 
/// <param name="username"></param> 
public void InitData(string username) 
{ 
SqlConnection mycon = new SqlConnection(); 
mycon.ConnectionString = ConfigurationManager.ConnectionStrings["BoBoConn"].ToString(); 
string sql = "select Fullname,Email,MobilePhone,QQ from loginuser where username='"+username+"'"; 
mycon.Open(); 
SqlCommand mycom = new SqlCommand(sql, mycon); 
SqlDataReader myda = mycom.ExecuteReader(); 
while (myda.Read()) 
{ 
string fullname = myda["Fullname"].ToString(); 
string Email = myda["Email"].ToString(); 
string MobilePhone = myda["MobilePhone"].ToString(); 
string QQ = myda["QQ"].ToString(); 
string array = fullname + "," + Email + "," + MobilePhone+","+QQ; 
Response.Clear(); 
Response.ContentType = "application/text"; 
Response.Write(array); 
Response.End(); 
} 
} 
/// <summary> 
/// 创建人：周昕 
/// 创建时间：2009-06-11 
/// 方法名称：Isusername 
/// 作用：返回bool值判断用户是否存在 
/// </summary> 
/// <param name="username"></param> 
/// <returns></returns> 
public bool Isusername(string username) 
{ 
SqlConnection mycon = new SqlConnection(); 
mycon.ConnectionString = ConfigurationManager.ConnectionStrings["BoBoConn"].ToString(); 
string sql = "select count(*) from loginuser where username='" + username + "'"; 
mycon.Open(); 
SqlCommand mycom = new SqlCommand(sql, mycon); 
int n = (int)mycom.ExecuteScalar(); 
mycon.Close(); 
if (n > 0) 
{ 
return true; 
} 
else 
{ 
return false; 
} 
} 
} 