ajax 伺服器文字框自動填值

來源:互聯網
上載者:User

這樣的話就增加了伺服器的負擔。後面自己他細想了一下。想利用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 :<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;
}
}
}

效果:運行前只有使用者名稱文字框可用

當使用者輸入使用者名稱稱後:滑鼠離開文字框後效果如下:

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.