Friday, June 11, 2010

Trim column data using Jquery

In this article, I am going to show a good way to trim characters of columns.

In software development, we always need to be worked with ASP.NET grid (GridView). It may be possible that below scenario happens.


To make consistent row height, which are messed up because of the columns data which are not able to reside for the configured column width. So height of the row is increased.

There are 2 possible ways to remove above scenario, which are described
below.
Solution 1:
Get the trimmed data from database and bind it in GridView. This solution is not explored in this mail.
Solution 2:
Use the power of JQuery without any server side manipulation. Please refer below image and javascript.


                      Fig 1. GridView Column  
                        
                                   
Fig 2: Resultant output

             
3: JQuery solution


Developer Guide:

1. Just add above function "GridManipuation" in your page.

2. Apply class "col-limit" to columns whose chars need to be trimmed.

3.  Syntax: GridManipulation(grid,limit)
    grid: jquery grid object
    limit: chars are displayed in the column
On particular event, find the grid object using jquery("ready" event in above example).
and call the function on that event.
Pros:
      1.Grid looks consistent.
Cons:
      1.To read full column detail, user needs to hover particular column of the row. Because full detail are written.
NOTE:
1. Do not use above
solution where more information is actually
required. In some grid, client wants more information like Customer’s
Full Address in single column.

2. Generally, this solution is useful to display logs.


Wednesday, February 24, 2010

Limit HTML content in Javascript

How to limit html content excluding tags, styles in JavaScript?
e.g. Consider the below scenario;
html: Welcome! Vips Patel to the site Logout.
limit: 12
desired output: Welcome! Vips.

For above desired output, below logic is implemented.


function limitHTML (html, limit)
{
limit = parseInt(limit, 10);
var counter = 0;

//Step 1:
//splits the html content with "<"
//So the resultant array has
// 1) "" 2) i>Welcome!
// 3)"" 4) b>Vips Patel,.....
// 5)"" 6) /b> to the site
// 7)"" 8) /i>
// 9)"" 10) a>Logout
//11)"" 12) /a>.

var a1 = html.split("<");
var i = 0;

//Step 2:
//Again split every element with ">" and check it has length of 2
//If yes, then second element has all text of html tag.
//Process text of html tag available in second element of array.
// i>Welcome! => 1)i and 2) Welcome!

while (counter <= limit && i < a1.length) {
var txt = a1[i];
var a2 = txt.split(">");
if (a2.length > 1) {
counter += a2[1].length;
}
i++;
}

//increment i if any for last closing tag

i++;

//Step 3:
//If count reaches then splice the array and return string
//after joining with "<"

a1.splice(i, a1.length - i);
var str = a1.join("<");
return str;
}

Tuesday, July 14, 2009

Convert Columns into comma seperated row

DECLARE @Role VARCHAR(max)

SELECT
@Role = COALESCE((@Role + ','), '') + LTRIM(STR(Role_ID))
FROM
Member_Role Where MemberID = 1

SELECT @Role

Above SQL generates the comma separated row.

Friday, April 24, 2009

Find the Node having none attribute using C#

Today, I need to search node having none attributes from xml file.

For this, We need to use below XPath query in SelectNodes of the XMLDocument object.

XMLNodeList list = doc.SelectNodes(@"parenttag/child1/child11[not(@*)]");

returns the child11 having none attributes.

Wednesday, April 22, 2009

For ASP.NET, WebApplication to WebSite

Hey!! Guys. Today We have the requirement to convert ASP.NET Application into ASP.NET Web site.

For this conversion we need to follow the below steps
1. Open the ASP.NET Web Application folder
2. Delete all *.designer.cs files.
3. Delete all *.csproj files.
4. Delete all *.csproj.user files.
5. Delete "Bin","obj" and "Properties" Folders.
6. Now open the solution
7. Remove the reference of  ASP.NET Web Application.
8. Add the existing site and give the reference of the folder (ASP.NET Web Application). Now it is became the ASP.NET Web site.
9. If there are any standalone ".cs" file then move those files into "App_Code" folder (If it does not exist then create it).
10. In All *.aspx file, change the attribute "CodeBehind" to "CodeFile" in "Page" directive.
11. Build the ASP.NET Web Site.


Let me know if you will face any problem during conversion process.