Add tooltip to Items in a GridView after DataBind

Question

I've an ASP page that is populated entirely in code behind c#.

I have to do this because I don't know how many GridView I get from my query.

So I put a placeholder like this:

<td>
    <asp:Label runat="server" ID="result"></asp:Label>
    <asp:HiddenField runat="server" ID="controlLoaded" />
    <asp:PlaceHolder runat="server" ID="phTest"></asp:PlaceHolder>
</td>

So I've created as many DataTables as result from my query. After that my code generates the same number of GridViews that I've to manage.

My need is to "truncate" some data to max 25 letters and display a tooltip when passing over with the mouse.

The code is:

gv.DataSource = dt;
        gv.DataBind();

        int maxWordLength = 25;
        foreach (GridViewRow row in gv.Rows)
        {

            for (int i = 3; i <= 4; i++)
            {
                string tmpValore = row.Cells[i].Text.ToString();
                int lungValore = tmpValore.Length;
                if (lungValore > maxWordLength)
                {
                    string nuovoValore = tmpValore.Substring(0, maxWordLength) + "...";
                    row.Cells[i].Text = nuovoValore;
                    row.Cells[i].ToolTip = tmpValore;
                }
            }
        }
        gv.DataBind();

But the GridViews remain the same with long "strings".

example: "CENTRO DIURNO PSICHIATRICO CAMALEONTE" have to show like: "CENTRO DIURNO PSICHIATRI..." with the whole string showed on mouse over

Screen Shot :

How can I reach such result?

The entire code of the method is:

 private GridView creaColonne()
{
    GridView gv = new GridView();

    gv.AutoGenerateColumns = false;

    BoundField id = new BoundField();
    id.HeaderText = "Id";
    id.DataField = "Id";
    id.Visible = false;
    //id.HeaderStyle.Width = new Unit(45, UnitType.Pixel);

    BoundField dal = new BoundField();
    dal.HeaderText = "Dal";
    dal.DataField = "Dal";
    dal.HeaderStyle.Width = new Unit(65, UnitType.Pixel);

    BoundField al = new BoundField();
    al.HeaderText = "Al";
    al.DataField = "Al";
    al.HeaderStyle.Width = new Unit(35, UnitType.Pixel);

    BoundField unita = new BoundField();
    unita.HeaderText = "Unita";
    unita.DataField = "Unita";
    unita.HeaderStyle.HorizontalAlign = HorizontalAlign.Left;
    unita.ItemStyle.HorizontalAlign = HorizontalAlign.Left;
    unita.HeaderStyle.Width = new Unit(245, UnitType.Pixel);

    BoundField mansione = new BoundField();
    mansione.HeaderText = "Mansione";
    mansione.DataField = "Mansione";

    mansione.HeaderStyle.Width = new Unit(245, UnitType.Pixel);

    BoundField ore = new BoundField();
    ore.HeaderText = "Ore";
    ore.DataField = "Ore";
    ore.HeaderStyle.HorizontalAlign = HorizontalAlign.Center;
    ore.ItemStyle.HorizontalAlign = HorizontalAlign.Right;
    ore.HeaderStyle.Width = new Unit(50, UnitType.Pixel);

    BoundField perc = new BoundField();
    perc.HeaderText = "%";
    perc.DataField = "Perc";
    perc.HeaderStyle.Width = new Unit(50, UnitType.Pixel);

    gv.Columns.Add(id);
    gv.Columns.Add(dal);
    gv.Columns.Add(al);
    gv.Columns.Add(unita);
    gv.Columns.Add(mansione);
    gv.Columns.Add(ore);
    gv.Columns.Add(perc);

    return gv;
}

public object Popola(List<DataTable> ventilati) 
{
    var ph = new PlaceHolder();
    int indice = 1;
    foreach (DataTable dt in ventilati)
    {

        Panel dynamicPanel = new Panel();

        string periodo = dt.Rows[0].Field<string>("Dal") + dt.Rows[0].Field<string>("Al");
        HtmlTable ht = new HtmlTable();
        HtmlTableRow htr = new HtmlTableRow();
        HtmlTableCell htc = new HtmlTableCell(); //Cella che contiene i dati
        HtmlTableCell htc2 = new HtmlTableCell(); //Cella che contiene i pulsanti

        htc2.Align = "center";
        ht.Width = "750px";
        ht.Border = 1;
        if (indice++ % 2 == 0)
        {
            ht.BgColor = "#66FFFF";
        }
        else
        {
            ht.BgColor = "#3399FF";
        }

        ht.CellPadding = 2;

        htc.Width = "720px";
        GridView gv = creaColonne();


        gv.DataSource = dt;
        gv.DataBind();

        int maxWordLength = 25;
        foreach (GridViewRow row in gv.Rows)
        {

            for (int i = 3; i <= 4; i++)
            {
                string tmpValore = row.Cells[i].Text.ToString();
                int lungValore = tmpValore.Length;
                if (lungValore > maxWordLength)
                {
                    string nuovoValore = tmpValore.Substring(0, maxWordLength) + "...";
                    row.Cells[i].Text = nuovoValore;
                    row.Cells[i].ToolTip = tmpValore;
                }
            }
        }
        gv.DataBind();
        gv.CssClass = "tab_gen";
        gv.Width = Unit.Percentage(100);

        gv.ID = "gvEdit" + periodo.ToString();

        htc.Controls.Add(gv);

        dynamicPanel.ID = "pnlEdit" + periodo.ToString();
        int finePeriodo = int.Parse(dt.Rows[0][2].ToString());
        int inizioPeriodo = int.Parse(dt.Rows[0][1].ToString());

        DateTime today = DateTime.Today;
        int periodoOggi = today.Year * 100 + today.Month;

        bool editable = false;
        if (today.Day < 16 || finePeriodo >= periodoOggi)
        {
            editable = true;
        }

        htc2.Width = "30px";
        if (editable)
        {
            editaButton = new ImageButton();
            editaButton.Command += new CommandEventHandler(this.editaButton_Click);
            //editaButton.OnClientClick += new EventHandler(this.editaButton_Click);
            editaButton.ID = "btnEdit" + periodo.ToString();
            editaButton.ImageUrl = "~/image/edit.png";
            editaButton.ToolTip = "Edita";

            htc2.Controls.Add(editaButton);
            Label newLine = new Label();
            newLine.Text = "<br />";
            htc2.Controls.Add(newLine);

        }

        duplicaButton = new ImageButton();
        duplicaButton.Command += new CommandEventHandler(this.duplicaButton_Click);
        //duplicaButton.OnClientClick += new EventHandler(this.duplicaButton_Click);
        duplicaButton.ID = "btnDuplica" + periodo.ToString();
        duplicaButton.ImageUrl = "~/image/duplicate.png";
        duplicaButton.ToolTip = "Duplica";


        htc2.Controls.Add(duplicaButton);

        htr.Controls.Add(htc);
        htr.Controls.Add(htc2);
        ht.Controls.Add(htr);
        dynamicPanel.Controls.Add(ht);

        ph.Controls.Add(dynamicPanel);

    }

    ph.DataBind();

    return ph;
}

Answer 1

Write this on your Gridview RowDataBound Event. This worked for me.

protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        string UnitaText = e.Row.Cells[3].Text;
        ViewState["OrigData"] = UnitaText;
        if (UnitaText.ToString().Length >= 25)
        {
            UnitaText = UnitaText.Substring(0, 25) + "...";
            //20 is the length of your string, you can change it to whatever length you want.
            e.Row.Cells[3].Text = UnitaText;
            e.Row.Cells[3].ToolTip = ViewState["OrigData"].ToString();
        }
    }
}