Coding Tips

I have created a Web user control and have a button, when I press on that button I register a script with Page.ClientScript.RegisterStartupScript and it works. But when I put the control into my UpdatePanel the client-side script will not work, any idea?

You need to use the ScriptManager to register the script block, because the scripts registered with the Page object will not be sent back to the client after a partial update. You can for example use the ScriptManager.GetCurrent method to get the instance of the ScriptManager added to your page, and then use its RegisterClientScriptBlock method, for example:

VB.Net

Dim current As ScriptManager = ScriptManager.GetCurrent(Me.Page)

current.RegisterClientScriptBlock(Me.Page, Me.GetType(), “key”, “your script”, True)

C#

ScriptManager current = ScriptManager.GetCurrent(this.Page);

current.RegisterClientScriptBlock(this.Page, this.GetType(), “key2, “your script”, true);

Adding Auto suggest box using Ajax(Microsoft ASP.NET Ajax extension) was very easy. You need a web service (returning the list of words), the autocompleteextender to show the panel and a text box. The webservice is required to return an array list.

The code to use the autocompleteextender is very simple

<ajaxtoolkit:autocompleteextender runat="server"
id="AutoCompleteExtender1" enabled="true"
minimumprefixlength="1" servicepath="~/SuggestionService.asmx"
servicemethod="GetAllNames"
targetcontrolid="txtSearch" />

Here MinimumPrefixLength is the number of words after which the the suggestion will be shown. Service path is the path to the web service and service method is the webmethod that will be used. The target control ID is the id of the textbox. That Is the syntax of the extender control. We also have to make a web service.

I decided to keep the values in a array list .

The web service is like this

SuggestionService.asmx

     [WebMethod]
    [System.Web.Script.Services.ScriptMethod]
    public string[] GetAllNames(string prefixText, int count)
    {
        ArrayList filteredList = new ArrayList();
        string s2 = "\n";
        char[] ch = s2.ToCharArray();
        string[] names ={ "India", "UK", "US", "China", "Nepal" };

        foreach (string name in names)
        {
            if (name.ToLower().StartsWith(prefixText.ToLower()))
            {
                filteredList.Add(name);
            }
        }
        return (string[])filteredList.ToArray(typeof(string));
    }

When you have a name as common as mine, you run across the entire gamut of schemes to deal with username availability in membership systems. By availability, of course I mean denial and rejection. Out of all of the ways that I’ve had “Dave” rejected, inline AJAX verification is definitely the least annoying. Wanting to be less-annoying myself, I’ve added the same functionality to my ASP.NET AJAX sites. Let me show you how I did it.

Note: I will preface this example by saying that an UpdatePanel is not the most efficient possible way to solve the problem. Something like this is lighter over the wire. However, for the vast majority of sites, this method is perfectly suitable and much easier to work with.

Setting up the page.

For this example, I’m going to use a very simple registration form:

    Username: <asp:TextBox runat="server" id="Username" /><br />
Password: <asp:TextBox runat="server" ID="Password" /><br />
Confirm: <asp:TextBox runat="server" ID="PasswordConfirm" /><br />
<asp:Button runat="server" ID="Button1" Text="Sign me up!" />

Since I want to work with it asynchronously, I’m going to wrap the Username TextBox in an UpdatePanel. I’m also going to enable AutoPostBacks on it and handle its OnTextChanged event. Inside an UpdatePanel, this will cause a partial postback to the event handler any time the TextBox loses focus and its contents have changed.

<asp:UpdatePanel runat="server" ID="up1">
 <ContentTemplate>
   Username: <asp:TextBox runat="server" id="Username"
   AutoPostBack="true" OnTextChanged="Username_Changed" /><br />
 </ContentTemplate>
</asp:UpdatePanel>

Note that I only wrapped the username line in the UpdatePanel. If the entire form were in an UpdatePanel, the returning partial postback would revert all of the form fields to their values when the postback initiated. That behavior would be undesirable here, where users will likely be tabbing through the form quickly and might complete several other fields during the partial postback.

Checking username availability

I decided to check availability through a call to Membership.GetUser(). If a user with the supplied name exists, the method will return the corresponding MembershipUser. Otherwise, it returns null. With this in mind our OnTextChanged event handler is easy:

protected void Username_Changed(object sender, EventArgs e)
{
 if (Membership.GetUser(Username.Text) != null)
   // Display a username taken message.
 else
   // Display a username available message.
}

This method should work with any .NET Membership Provider setup, regardless of your data store or other customizations. Obviously, if you’re using a custom authentication system instead of the .NET Membership Provider, then you’ll need to perform the availability check a different way.

If anyone knows of a more efficient method for checking the username availability, I’d be interested in hearing it. Returning an entire MembershipUser object to express (in this case) what boils down to a boolean value is painfully wasteful.

Displaying the availability result

I chose to display my message in a div, just to the right of the username field:

<asp:UpdatePanel runat="server" ID="up1">
 <ContentTemplate>
   Username: <asp:TextBox runat="server" id="Username"
   AutoPostBack="true" OnTextChanged="Username_Changed" />
   <div runat="server" id="UserAvailability"></div><br />
 </ContentTemplate>
</asp:UpdatePanel>

With that element now accessible, I can complete the Username_Changed event handler:

protected void Username_Changed(object sender, EventArgs e)
{
 if (Membership.GetUser(Username.Text) != null)
 {
   UserAvailability.InnerText = "Username taken, sorry.";
   UserAvailability.Attributes.Add("class", "taken");
 }
 else
 {
   UserAvailability.InnerText = "Username available!";
   UserAvailability.Attributes.Add("class", "available");
 }
}

The relevant CSS:

#UserAvailability {
 padding-left: 22px;
 background-position: left;
 background-repeat: no-repeat;
}

.taken {
 background-image: url(taken.gif);
}

.available {
 background-image: url(available.gif);
}

The CSS classes, taken and available, are used to display a left positioned background image in the div (as seen in the screenshot above). The left padding ensures that the text message doesn’t overlap the status image. This visual cue is very powerful, and should not be overlooked.

That’s it!(source -http://encosia.com)