ajax 服务器文本框自动填值

2016-02-19 11:00 5 1 收藏

下面是个超简单的ajax 服务器文本框自动填值教程,图老师小编精心挑选推荐,大家行行好,多给几个赞吧,小编吐血跪求~

【 tulaoshi.com - Web开发 】

这样的话就增加了服务器的负担。后面自己他细想了一下。想利用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 style="text-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
trtd colspan='2' style=" text-align:left" 用户名称:asp:TextBox ID="Txtusename" runat="server"/asp:TextBox/td/tr
trtd style=" text-align:left;width:400px" 用户全名:asp:TextBox ID="fullname" runat="server" ReadOnly="true"/asp:TextBox/tdtd style=" text-align:left; width:400px"用户邮箱:asp:TextBox ID="Email" ReadOnly="true" runat="server"/asp:TextBox/td/tr
trtd style=" text-align:left;width:400px"手机号码:asp:TextBox runat="server" ID="mobilphone" ReadOnly="true"/asp:TextBox/tdtd 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;
}
}
}

效果:运行前只有用户名文本框可用

当用户输入用户名称后:鼠标离开文本框后效果如下:

来源:https://www.tulaoshi.com/n/20160219/1596330.html

延伸阅读
标签: 电脑入门
方法一、创建了文本框之后,然后在选择文本框,选择文本框点del键的是将文本框的内容给删除掉。需要将文本框一并删除掉的话,需要移动到文本框的框边缘,出现一个十字箭头的样式,然后点击,这样即可删除文本框了。 方法二、将文本框设置为无线条颜色。双击文本框,然后选择,将线条设置无颜色,这样虽然没有删除文本框,但是文本框看起来跟输...
标签: 电脑入门
Word文档里面可以包含各种各种的对象,其中,有几种对象不是普通文字,比如图片、艺术字、文本框等,这些对象不是纯文本,在操作上,肯定与文本的操作有所不同! 下面,给大家介绍的这个问题是,Word里面的文本框无法删除。遇到文本框删不掉,如何才能删除呢? 针对该问题,原因出自两个方面,下面逐一为你道来。 一、文本框对象未选对 关于...
首先看下看下相对简单些的--向服务器发送一个包含有名/值对的简单查询串,在这种情况下XHP即可以用GET也可以用POST。 GET function doRequestUsingGET() { createXMLHttpRequest(); var queryString = " GetAndPostExample? " ; queryString = queryString + createQueryString()+ " &timeStamp= " + new Date().getTime(); ...
标签: Web开发
不错的代码,一直收藏着!  程序代码 script i=1 var autourl=new Array() autourl[1]="http://www.XXXX.NET" //这个是电信服务器站点 autourl[2]="http://XXXXX.COM" //这个是网通服务器站点 function auto(url) { if(i) { i=0; top.location=url }} function run() { for(var i=1; iautourl.length;i++) document.write("img src="+au...
celluloid如何创建文本框   点击主工具栏中的 文字工具 按钮,单击生成,在页面中的文本框键入文本内 容即可。 双击文本框可输入文字,如果是复制过来的文字,直接粘贴即可,完成文字键入后,点击文本框外任意页面区域可退出文本编辑模式。 拖移节点调整文本显示以及文本框框大小。 将文本框拖移到您想...

经验教程

532

收藏

55
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部