Thursday 16 February 2012

How To Show limited characters in Gridview columns

Show limited characters in Gridview columns /
Show the tool-tip for Gridview rows and cells

Often you'll see,when you have a long text in your gridview it get scattered but not in gmail,where long subject included in your mail. Its because its a up to column length that how much text it can show you in which way.So here is a basic sample which do something like that.


1) A sample of ( Email)  limited characters in gmail.








2) After You've  Done Binding In GridView And The Value Are Showing In Gridview.
 You Will Notice You Have Few Things In Your Grid View Events,  Included Databound & RowDataBound.Just Click On RowDataBound And Follow The Below Code.









3) Just Enter The Code Below Under RowDataBound To Show You The Things I've Mentioned Above.


protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        int i = 0;
        //e.Row.Cells[2].Visible = false;   //you can use it to  hide coloumn in run time
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            foreach (TableCell cell in e.Row.Cells)
            {
                i++;
                string s = cell.Text;
                if (cell.Text.Length > 10 && (i == 4))       //i ==4 means start from 4th cell start with [0,1,2,3,4]
                    cell.Text = cell.Text.Substring(0, 10) + "...."; 
                cell.ToolTip = s;           // full text Exist in tooltip
            }
        }
    }


Above Green Marked Text Are Comment To Make You Understand Whats Going On In The Code.



Download Sample from Here








Here are few more way for you requirement!!!


1.Code Behind Approch(C#)_____________________
1.Put this function on code behind




public static string Limit(object Desc, int length)
{
    StringBuilder strDesc = new StringBuilder();
    strDesc.Insert(0, Desc.ToString());

    if (strDesc.Length > length)
        return strDesc.ToString().Substring(0, length) + "..." ;
    else return strDesc.ToString();
}





2.Replace

Text='<%#Eval("Product_Name") %>'


3.From your Template field with
Text='<%# Limit(Eval("Product_Name"), 35) %>'















2. Html Approch(CSS)________________________
<style type="text/css">
       span{
    display:inline-block;
    width:180px;
    white-space: nowrap;
    overflow:hidden !important;
    text-overflow: ellipsis;
}</style>

<span>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen look</span>





No comments:

Post a Comment

Print Only Grid View in ASP.net

ASP.net How to Print Only GridView < div id ="gridviewDiv" >   < asp:GridView ID ="gridViewToPri...