Radiobuttonlist with a tooltip context from database

I came across this request and solved with a solution by adding listitems from code and add Titile attribute to the listitems for the tooltip content.

(http://forums.asp.net/t/1487353.aspx)

The forum user came back one month later with extra but I cannot make it work with the internal property tweak. With the clue from the user research, I continued with the search and found another solution with CSS style. I dropped the title property solution with a hyperlink which includes listitems and contents for tooltips.

The style I grabbed from this link: http://jlhaslip.trap17.com/samples/tooltips/index.html

Finally, I came up with the solution for the new requirement from this thread: http://forums.asp.net/p/1500095/3546469.aspx#3546469

 

I post the answer here for future reference:

Here is a link of the style you will use for your tooltips:

http://jlhaslip.trap17.com/samples/tooltips/index.html

Here is the CSS style from the link:

text/css">
 /*
        =================================
        start of Tooltip css code here
        ================================= */
 
        a.info{
        position:relative;           /*this is the key*/
        z-index:24;
        background-color:#e0e0e0;    /* background colour of display text */
        color:#000000;               /* colour of display text */
        border:1px dotted #999;    /* border colour */
        text-decoration:none;
        font-style:italic;
        }
 
        a.info:hover {
        z-index:25;
        background-color:#ffff66;
 
        }
 
        a.info span{
        display: none;  /* hide the span text using this css */
        }
 
        a.info:hover span{ /*the span will display just on :hover state*/
        display:block;
        position:absolute;
        top: 1.5em;
        left: 3em;
        width:15em;
        border:1px solid #ff0000; /* border colour */
        background-color:#ffff99; /* background colour here */
        color:#000000;         /* text colour */
        text-align: center;
        font-size: .8em;
        font-style:italic;
        z-index:30;
        }
 

SqlConnection sqlConn1 = new SqlConnection(connectionString);

SqlCommand sqlCmd_GetChangeTypes = new SqlCommand("Select ID, Name, tooltip FROM [aTable]", sqlConn1);

sqlConn1.Open();

SqlDataReader rblReader_ChangeTypes = sqlCmd_GetChangeTypes.ExecuteReader();

if (rblReader_ChangeTypes.HasRows)

{

while (rblReader_ChangeTypes.Read())

{

string myLink = "<a href=\"#\" class=\"info\">" + rblReader_ChangeTypes["Name"].ToString() + "<span>"+rblReader_ChangeTypes["ToolTip"].ToString()+"</span></a>";

ListItem li = new ListItem(myLink, rblReader_ChangeTypes["ID"].ToString());

//li.Attributes.Add("title", rblReader_ChangeTypes["ToolTip"].ToString());

//li.Attributes.Add("class", "info");

li.Attributes.Add(

"ID", rblReader_ChangeTypes["ID"].ToString());

rblChangeType.Items.Add(li);

//Source for Tooltip

// http://jlhaslip.trap17.com/samples/tooltips/index.html

}

rblChangeType.SelectedIndex = 0;

}

else

{

// logic for no rows had been returned

}

rblReader_ChangeTypes.Close();

sqlConn1.Close();