Dheeraj's Tech Wiki

Multi-line Textbox Character Counter

2010-06-06T16:38:00.000-07:00

In this article you would learn how create an ASP.NET user control with jQuery which displays the character count of a multi-line textbox below it. The user control takes the character limit as one of its properties. Below is the markup of my usercontrol:

 Height="50px" runat="server">

Below is the jQuery code I have used in the user control:

$(document).ready(function() {
        $('#<%=tbMultiLine.ClientID %>').keyup(function(e) {
            var limit = $('#<%=hdnCharacterLimit.ClientID %>').val();
            var tbLength = $(this).val().length;
            if (tbLength > limit) {
                this.value = this.value.substring(0, limit);
                e.preventDefault();
            }
            $('#<%=lblCharCount.ClientID %>').show();
            $('#<%=lblCharCount.ClientID %>').text($(this).val().length + '/' + $('#<%=hdnCharacterLimit.ClientID %>').val() + ' characters');
        });
    });

When the DOM is ready I add a keyup event to the multi-line textbox and get the character limit from a hidden field in the user control. I then check to see if the character count is greater than the limit and if so then I remove the additional characters and prevent the default action for the textbox.

Demo

Download Code

Script Manager VS Toolkit Script Manager

2010-02-02T12:58:00.000-08:00

Recently I noticed that there was a control named ToolkitScriptManager in the ASP.NET AJAX Control Toolkit and I was wondering how it was different from the regular ScriptManager. After reading this wonderful blogpost I came to know that ToolkitScriptManager will combine all the ASP.NET AJAX scripts by default. I decided to run a small test to see how exactly this effects performance and the results were quite impressive. I first created a simple page with the ScriptManager and the AJAX Calendar Extender control. Below is the screenshot from firebug:

As you can see from the above screenshot that with the ScriptManager control we are making 15 requests to the server, page size is 168.4kb and it takes 5.62 seconds to load this page. Now lets see how ToolScriptManager changes these numbers:

Now the you can see that the number of requests have come down to 7, page size is 124kb and it takes only 4.03 seconds to load this page.

All you need to do is just REPLACE

WITH

Conclusion: Imagine if you are saving 8 requests, 44kb of data and 1.59 seconds of load time on a page with a single AJAX Control. How much performance gain would you get on a page with update panels and many AJAX controls?

How to get all non-nullable column names, types and lengths in a SQL Server database table?

2009-12-31T20:28:00.000-08:00

I was working on a SQL Server database table which had around 100 columns and I wanted to insert a new row into that table. But in order to do that I had to know all the non-nullable column names, types and lengths in that table and below is the query I have used to achieve that:

select COLUMN_NAME, DATA_TYPE, CHARACTER_MAXIMUM_LENGTH 
from information_schema.columns
where table_name = 'TABLE_NAME'
AND IS_NULLABLE = 'NO'

Dynamically Adding Tab Panels To An ASP.NET AJAX Tab Container

2009-12-06T22:31:00.000-08:00

I wanted to add some Tab Panels to my ASP.NET AJAX Tab container from my code behind file. Below is the code on my .aspx page:

Blow is my code in the aspx.cs file to add two new tab panels to the tab container:

TabPanel t1 = new TabPanel();
            t1.ID = "Tab1";
            t1.HeaderText = "Tab:1";

            TabPanel t2 = new TabPanel();
            t2.ID = "Tab2";
            t2.HeaderText = "Tab:2";

            TabContainer1.Tabs.Add(t1);
            TabContainer1.Tabs.Add(t2);

Pretty straight forward stuff. But to my astonishment when I ran the page I couldn't see my tab control in the browser. Below is the HTML generated for my two tab panels:

<div id="TabContainer1_Tab1" class="ajax__tab_panel" style="display:none;visibility:hidden;">
</div>
<div id="TabContainer1_Tab2"; class="ajax__tab_panel" style="display:none;visibility:hidden;">
</div>

As you can see from the above HTML that my two tab panels visibility is set to hidden by default. In order make the tab control visible we have to set the ActiveTabIndex for thr tab container as follows:

TabContainer1.ActiveTabIndex = 0;

How to Fix "Connections to SQL Server files (*.mdf) require SQL Server Express 2005 to function properly."

2009-11-08T21:39:00.000-08:00

I have a 64-bit PC with Windows 7 and Visual Studio 2008 with SP1 installed on it. When I tried to add new a SQL Server 2008 express database into the App_Data folder of my Website project I got the following error:

"Connections to SQL Server files (*.mdf) require SQL Server Express 2005 to function properly. Please verify the installation of the component of download from the URL:
http://go.microsoft.com/fwlink/?LinkId=49251"

This problem occurs because Visual Studio 2008 SP1 incorrectly detects some registry keys for a 64-bit installation of SQL Server Express 2008. To fix this issue I had to download a hotfix for Visual Studio 2008 which is available HERE.

Using LINQ With Strings

2009-11-01T15:23:00.000-08:00

LINQ can be used to perform query operations on objects which implement the IEnumerable<T>. Since the String class implements the IEnumerable<char> interface we can perform various string operations using LINQ. In the below example I have used LINQ to extract the common characters in two strings.

Note: For some weired reason Visual Studio doesn't show the LINQ extension methods in the intellisense for string objects.

string str1 = "abc";
 string str2 = "bcd";

Func match = (s,c) => s.Contains(c);

 var chars = from c in str1
             where match(str2, c)
             select c;

 foreach (var c in chars)
  {
    Console.WriteLine(c);
  }
 Console.Read();

Here is the Output: