使用ajax检查asp.net中用户名的可用性

本文关键字：用户 可用性 net ajax 检查 asp 使用 | 更新日期: 2023-09-27 18:06:49

我有以下文本框在我的asp.net页面。用户在其中输入任何用户名，我希望ajax检查可用性，并在用户离开文本框时在标签中显示成功或失败消息。

 UserName<asp:Label ID="usernamelbl" runat="server"></asp:Label>
<asp:TextBox ID ="usernametxt" runat="server" CssClass="twitterStyleTextbox"></asp:TextBox><br />

这就是我如何使用ajax

function result() {
             var username = "<%=usernametxt%>";
             var result = "<%usernamelbl%>";// here i am getting an error on usernamelbl
             var jsonText = JSON.stringify({ list: username });
             //array = +jsonText;
             $.ajax({
                 url: "staffregistration.aspx/Test", type: "POST", dataType: "json",
                 contentType: "application/json; charset=utf-8",
                 data: jsonText,
                 success: function (data) {
                     if (data == username) {
                         result = "username available"
                     }
                     else {
                         result = "username not avilable"
                     }},
                 error: function () { alert("its not working"); }
             });
             return false;
         }

，这就是我与aspx的交互方式

public static string Test(string username)
{
    string conString = @"user id=ejaz;password=ejaz;persistsecurityinfo=True;server=localhost;database=geospatialdb";
    MySqlConnection conn = new MySqlConnection(conString);
    MySqlDataReader reader = null;
    conn.Open();
    MySqlCommand command = new MySqlCommand("select owner_id from owner where owner_username = '" + usernametxt.Text + "';", conn);

    reader = command.ExecuteReader();
    username = reader[0].ToString();
    return username;
}

使用ajax检查asp.net中用户名的可用性

下面是如何使用JavaScript通过onChange事件和使用WebMethods的Ajax来检测usernametext中的变化。

ASPX Page:确保在ScriptManager对象中设置EnablePageMethods = true。

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
<asp:UpdatePanel runat="server" ID="usernameupdatepanel">
    <ContentTemplate>
        UserName <asp:Label ID="usernamelbl" runat="server"></asp:Label>
        <asp:TextBox ID ="usernametxt" 
             runat="server" CssClass="twitterStyleTextbox" 
             OnChange="CheckUserName(this)" ></asp:TextBox><br />
    </ContentTemplate>
</asp:UpdatePanel>
JavaScript: 

function CheckUserName(oName) 
{
    PageMethods.UserNameChecker(oName.value, OnSucceeded); 
}
function OnSucceeded(result, userContext, methodName) 
{   
    lbl = document.getElementById('<%=usernamelbl.ClientID %>'); 
    if (methodName == "UserNameChecker") 
    { 
        if (result == true) 
        { 
            lbl.innerHTML = 'username not available'; 
            lbl.style.color = "red"; 
        } 
        else 
        { 
            lbl.innerHTML = 'username available'; 
            lbl.style.color = "green"; 
        } 
    } 
}

c# Code-Behind:你可以调用WebMethod来检查新选择的文件名是否存在于数据库中:

您需要引用以下内容:

using System.Web.Services;

然后添加以下方法，并确保将[WebMethod]放在方法声明之前:

[WebMethod]
public static bool UserNameChecker(string newUserName)
{
    string conString = @"user id=ejaz;password=ejaz;persistsecurityinfo=True;server=localhost;database=geospatialdb";
    MySqlConnection conn = new MySqlConnection(conString);
    MySqlDataReader reader = null;
    conn.Open();
    MySqlCommand command = new MySqlCommand("select owner_id from owner where owner_username = '" + newUserName + "';", conn);
    object found = command.ExecuteScalar();
    if (found != null)
        return true;
    else
        return false;
}

以更简单的方式，只需添加scriptmanager标记和更新面板，然后添加文本框。注意:不要忘记将autopostback设置为true，并添加一个事件，即OnTextChanged事件及其处理程序

 <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <asp:TextBox ID="TextBox1" runat="server" TextMode="Email" OnTextChanged="TextBox1_TextChanged" AutoPostBack="true"></asp:TextBox>
                        <asp:Label ID="Label2" runat="server" Text="" ></asp:Label>   
                    </ContentTemplate>
                </asp:UpdatePanel>

事件处理程序

 protected void TextBox1_TextChanged(object sender, EventArgs e)
        {
            //your logic 
        }
相关文章：