Board Logo

Dynamic hint text retrieved from DB
Linkey - 5/22/2003 at 08:13 PM

Here is what I am currently doing w/out the hints script:

retrieving a resultset from a Oracle DB and list the records in a table.

Now what I would like to do is for one of the columns, "ID", the value can be quite large, so I will be using Java to only display the last 30 characters. But would like to use the hints script to display the full text once I mouseover the column.

Is this possible? Since I noticed that the Hints script requires one to predefine the values one wishes to display as the hint text.

nik - 5/23/2003 at 07:11 AM

Of course, it's possible. For a convenience of referring certain hint after declaring them, you can declare hints not in an array but in javascript object with property names you need. For example:

'hint1' : 'A text for hint 1',
'ahint' : 'Another hint content'

and then refer them when linking to HTML elements:

<a href="my.html" onMouseOver="'hint1')" onMouseOut="myHint.hide()" ....
<td onMouseOver="'ahint')" onMouseOut="myHint.hide()" ....

rvazquezto - 6/4/2003 at 06:45 PM

i try to do, but don't work. this is the code html generated by xxx.asp:


<script language="JavaScript" src="../MnF/hints.js"></script>
<script language="JavaScript">
'img1':"wrap_img('cccc0001.JPG', 'Foto Numero 1' )",
'img2':"wrap_img('cccc0002.JPG', 'Foto Numero 2' )",
'img3':"wrap_img('cccc0003.JPG', 'Foto Numero 3' )",
'img4':"wrap_img('cccc0004.JPG', 'Foto Numero 4' )",
'img5':"wrap_img('cccc0005.JPG', 'Foto Numero 5' )",
'img6':"wrap_img('cccc0006.JPG', 'Foto Numero 6' )",
'img7':"wrap_img('cccc0007.JPG', 'Foto Numero 7' )",
'img8':"wrap_img('cccc0008.JPG', 'Foto Numero 8' )",
'img9':"wrap_img('cccc0009.JPG', 'Foto Numero 9' )",
'img10':"wrap_img('cccc0010.JPG', 'Foto Numero 10' )",
'img11':"wrap_img('cccc0011.JPG', 'Foto Numero 11' )",
'img12':"wrap_img('cccc0012.JPG', 'Foto Numero 12' )",
'img13':"wrap_img('cccc0013.JPG', 'Foto Numero 13' )",
'img14':"wrap_img('cccc0014.JPG', 'Foto Numero 14' )",
'img15':"wrap_img('cccc0015.JPG', 'Foto Numero 15' )",
'img16':"wrap_img('cccc0016.JPG', 'Foto Numero 16' )"
function start(){
//alert("Chale" + HINTS_CFG.toString());
//myHint = new THints (HINTS_CFG, HINTS_ITEMS);


<script language="JavaScript" src="../MnF/hints_cfg.js"></script>
<body onload="start()">
<TABLE language="javascript" id="TblFotos" style="Z-INDEX: 100; LEFT: 11px; WIDTH: 503px; POSITION: absolute; TOP: 10px; HEIGHT: 75px" cellSpacing="0" cols="5" cellPadding="0" width="503" border="0">
<td align=center>F</td>
<TD align=center>O</TD>
<TD align=center>T</TD>
<TD align=center>O</TD>
<TD align=center>S</TD>
<tr><td align=center onMouseOver="'img1')" onMouseOut="myHint.hide()" >1</td>
<td align=center onMouseOver="'img2')" onMouseOut="myHint.hide()" >2</td>
<td align=center onMouseOver="'img3')" onMouseOut="myHint.hide()" >3</td>
<td align=center onMouseOver="'img4')" onMouseOut="myHint.hide()" >4</td>
<td align=center onMouseOver="'img5')" onMouseOut="myHint.hide()" >5</td>
</tr><tr><td align=center onMouseOver="'img6')" onMouseOut="myHint.hide()" >6</td>
<td align=center onMouseOver="'img7')" onMouseOut="myHint.hide()" >7</td>
<td align=center onMouseOver="'img8')" onMouseOut="myHint.hide()" >8</td>
<td align=center onMouseOver="'img9')" onMouseOut="myHint.hide()" >9</td>
<td align=center onMouseOver="'img10')" onMouseOut="myHint.hide()" >10</td>
</tr><tr><td align=center onMouseOver="'img11')" onMouseOut="myHint.hide()" >11</td>
<td align=center onMouseOver="'img12')" onMouseOut="myHint.hide()" >12</td>
<td align=center onMouseOver="'img13')" onMouseOut="myHint.hide()" >13</td>
<td align=center onMouseOver="'img14')" onMouseOut="myHint.hide()" >14</td>
<td align=center onMouseOver="'img15')" onMouseOut="myHint.hide()" >15</td>
</tr><tr><td align=center onMouseOver="'img16')" onMouseOut="myHint.hide()" >16</td>

wath's wrong?

do you have some sample using relational database?

Thanks for all!!

rvazquezto - 6/6/2003 at 04:41 PM

thanks! but i write this is asp page for generate a dynamic hints !!, i need tree step to work:

step 1:
in the hints_cfg.js file comment the line --
//var myHint = new THints (HINTS_CFG, HINTS_ITEMS);

step 2: create the file hintsRunner.js whit the next line -- var myHint = new THints (HINTS_CFG, HINTS_ITEMS);

step 3: write the asp file like this, the order to load the javascriptfile are important --

CONST DIRECTORY = "/WebApplication1/ImgsVehiculos"
dim rutaFotos
dim numSiniestro
dim fso
dim listaFiles
dim fileItem

redim listaFiles(2,0)
rutaFotos = Server.MapPath( DIRECTORY )
Set fso = CreateObject("Scripting.FileSystemObject")
Set theCurrentFolder = fso.GetFolder( rutaFotos )
Set curFiles = theCurrentFolder.Files

For Each fileItem in curFiles
fname = fileItem.Name
if 0<instr(fname,numSiniestro) then
redim preserve listaFiles(2,ubound(listaFiles,2)+1)
end if

<script language="JavaScript" src="../MnF/hints.js"></script>
<script language="JavaScript" src="../MnF/hints_cfg.js"></script>
response.Write("<script language=" & chr(34) & "JavaScript" & chr(34) & ">" & chr(13))
dim cadena
cadena = " HINTS_ITEMS = [ " & chr(13)
dim ih
for ih=0 to ubound(listaFiles,2)-1
if ih=ubound(listaFiles,2)-1 then
cadena=cadena & "wrap_img('" & trim(listaFiles(1,ih)) & "', '" & "Foto Numero " & listaFiles(0,ih) & "' )" & chr(13)
cadena=cadena & "wrap_img('" & trim(listaFiles(1,ih)) & "', '" & "Foto Numero " & listaFiles(0,ih) & "' )" & "," & chr(13)
end if
cadena = cadena + "];"
<script language="JavaScript" src="../MnF/hintsRunner.js"></script>
<BODY background=>
<TABLE language="javascript" id="Table1" cellSpacing="0" cols="5" cellPadding="0" width="503" border="1" height="33">
<td align="middle" bgcolor="#99cc99">F</td>
<TD align="middle" bgcolor="#99cc99">O</TD>
<TD align="middle" bgcolor="#99cc99">T</TD>
<TD align="middle" bgcolor="#99cc99">O</TD>
<TD align="middle" bgcolor="#99cc99">S</TD>
dim i
dim j
for i = 0 to ubound(listaFiles,2)-1
for j=1 to 5
if i>ubound(listaFiles,2)-1 then
exit for
response.Write("<td align=center onMouseOver=" & chr(34) & "" & listaFiles(0,i) & ")" & chr(34) & " onMouseOut=" & chr(34) & "myHint.hide()" & chr(34) & " >" & listaFiles(0,i) & "</td>" & chr(13))
end if
if j<> 5 then
end if

roger99 - 4/12/2006 at 06:11 PM

Failed to understand the rvazqueztos solution, most likly because of my poor knowledge in coding. CouldnA?t it be done as nik proposed? If so I need to know in what file to put

'hint1' : 'A text for hint 1',
'ahint' : 'Another hint content'

and I also need to know how to substitute the hardcoded "A text for hint 1" with the content I would like to show wich is in strText generated in my ASP-page

tigra - 4/13/2006 at 01:50 PM

Let's look at this as three step process (pretty much the same for all client side scripts):

1. configure the hints statically (without ASP, just in JS files) the way
you'd like them to work/look
2. move the configuration from external .JS file into main ASP document (the
one that you want hints to work with). For that remplace the link to the
configuration file:

<script language="JavaScript" src="hints_cfg.js"></script>

With the javascript block containing the tet of the configuration file

<script language="JavaScript">
// copy the text of the hints_cfg.js here

3. now replace the parts of the configuration in the script block with ASP
code/variable replacing the static values with ones from the dynamic source.

'TT1':wrap("Tigra Hints Product Page"),

can be replaced with:

'TT1':wrap("<% Response.Write("Hello World") %>"),

tigra - 5/19/2006 at 04:35 PM

and complete manual at:

Back to forum: