首页 > 代码库 > Ajax实现:注册时自动检测用户名是否存在

Ajax实现:注册时自动检测用户名是否存在

当光标离开用户名文本框时,自动检测当前用户名是否可以用于注册

 1  <tr> 2                                 <td width="231px" align="center" valign="top" style="height: 26px">用户名</td> 3                                 <td valign="top" width="357px" align="left" style="height: 26px"> 4                                     <asp:UpdatePanel runat="server"> 5                                         <ContentTemplate runat="server"> 6                                             <asp:TextBox ID="txtloginid" runat="server" AutoPostBack="True" OnTextChanged="txtloginid_TextChanged"></asp:TextBox> 7                                             <asp:Image ID="imgExist" runat="server" ImageUrl=""/> 8                                             <asp:Label ID="lblExist" runat="server" Text=""></asp:Label> 9                                         </ContentTemplate>10                                         <Triggers>11                                             <asp:AsyncPostBackTrigger ControlID="txtloginid" EventName="TextChanged" />12                                         </Triggers>13                                     </asp:UpdatePanel>14                                 </td>15                             </tr>

第一次加载页面:

<asp:Image ID="imgExist" runat="server" ImageUrl=""/>
由于未设置【ImageUrl=""】所以图片是不会显示的,相当于隐藏效果
<asp:Label ID="lblExist" runat="server" Text=""></asp:Label>
由于未设置【Text=""】所以label控件也是不会显示的,相当于隐藏效果

输入,txtloginid,通过Ajax,局部提交控件中的值,通过后台的【txtloginid_TextChanged】方法,判断当前输入的值是否可注册!!
-----Ajax用到的五个控件:
  1. <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
  2. <asp:UpdatePanel runat="server">
  3. <ContentTemplate runat="server">
  4. <asp:TextBox ID="txtloginid" runat="server" AutoPostBack="True" OnTextChanged="txtloginid_TextChanged"></asp:TextBox>
    <asp:Image ID="imgExist" runat="server" ImageUrl=""/>
    <asp:Label ID="lblExist" runat="server" Text=""></asp:Label>
    </ContentTemplate>

  5. <Triggers>

  6. <asp:AsyncPostBackTrigger ControlID="txtloginid" EventName="TextChanged" />
  7. </Triggers>

  8. </asp:UpdatePanel>
 1         /// <summary> 2         /// 文本框txtloginid中的值改变时,触发的事件 3         /// </summary> 4         /// <param name="sender"></param> 5         /// <param name="e"></param> 6         protected void txtloginid_TextChanged(object sender, EventArgs e) 7         { 8             string loginid = txtloginid.Text.Trim(); 9             if (loginid.Equals(""))10             {11                 imgExist.ImageUrl = "~/Images/Error.png";12                 lblExist.Text = "用户名不能为空!";13             }14             else15             {16                 if (bll.Exists(loginid))17                 {18                     imgExist.ImageUrl = "~/Images/Error.png";19                     lblExist.Text = "用户名已存在!";20                 }21                 else22                 {23                     imgExist.ImageUrl = "~/Images/Right.png";24                     lblExist.Text = "用户名可以注册!";25                 }26             }27         }

 

Ajax实现:注册时自动检测用户名是否存在