Member Avatar for Altairzq

I'm showing in a field the name of the file the user has chosen. I would like to show the whole name as the title when passing the mouse over the field, in case the name is too long.

I swear this was working, but it's not anymore (I'm testing with FF). I don't know how it was working, maybe I used a different combination of quotes or semicolons or I don't know. I can't make it work again. When you pass de mouse over the field it is showing the code instead of the innerHTML referenced:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>

<script type="text/javascript">

function newField()
{
document.getElementById('container').innerHTML = 
	'<div id="myFile" style="width:100px;overflow:hidden;border:thin solid" title="document.getElementById(\'myFile\').innerHTML">thisisaverylongfilename.jpg</div>';
}

</script>
    
</head>
<body onload="newField()">
	<div id="container" />
</body>
</html>

demo:
http://www.lloparts.com/america/editora/testTitle.html

Edited by Altairzq because: n/a
  • 5 Contributors
  • 9 Replies
  • 264 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Jupiter 2
Member Avatar for urtrivedi

Change your function as shown below

function newField()
{
document.getElementById('container').innerHTML = '<div id="myFile" style="width:100px;overflow:hidden;border:thin solid" title=\'' + document.getElementById('myFile').innerHTML+ '\'>thisisaverylongfilename.jpg</div>';
}

You may use document.getElementById('myFile').innerText

Member Avatar for Jupiter 2

Back in the old days of Javascript the Quote marks would be the outer marks of the reference and anything inside that required quote marks, used apostrophes. It seems thing have changed and it's the reverse action now?

Member Avatar for Altairzq

It's not working either, it gives an error because the field "myFile" doesn't exist yet.

It was working when I created the field from PHP-Ajax, could that be it? But if there wasn't Javascript involved how could it interpret the code? :confused:

This is the piece of code I used, more or less. This one is not working:

<tr>
	<td />
	<td colspan='3' style=\"padding-bottom:4px\">
		<div id='escollitOriPri' style=\"height:14px;text-align:center;font-size:11px;overflow:hidden;cursor:default\" title=\"document.getElementById('escollitOriPri').innerHTML\">
		</div>
	</td>
</tr>
Edited by Altairzq because: n/a
Member Avatar for Jupiter 2

This is my interpretation, as to how it "used" to be done but new coding might be different to what I've learnt.

<tr><td colspan=3 style=padding-bottom:4px>
<div id="escollitOriPri" style="height:14px;text-align:center;font-size:11px;overflow:hidden;cursor:default; title=document.getElementById('escollitOriPri').innerHTML"></div></td></tr>

colspane = 3 A number is not enclosed in quotes as it is a number and not text.

I do not know the reference of backslash for the style tags.
The only thing is if the title tag within the div tag is supposed to be there or in its own enclosures.
I'd be interested to see if my modifications work within your sheet.

Edited by Jupiter 2 because: Quote marks
Member Avatar for Alxandr

colspane = 3 A number is not enclosed in quotes as it is a number and not text.

In case you're interested, this isn't necessarily correct. Actually, I think I recall that if you use XHTML you MUST enclose everything in quotes (even empty literals). Using <button disabled>test</button> is also not legal using XHTML, you have to set <button disabled="disabled">test</button> if I recall correctly.

Also, in old HTML you had the OPTION of leaving off quotes at simple input. But it's nothing to worry about actually 'cause all normal browsers don't care anyway :-), but if you want to follow the new standards, always use quotes, and always close every tag (even br: <br /> .

Member Avatar for Jupiter 2 
<br />

I don't know what this means. Break actually doesn't have an "end break" tag. Break is just like a line return except it returns the cursor to the left margin new line.

<BR>
<P>

The Paragraph tag requires (but not usually implemented) an End Paragraph as it is a specific format. It inserts a line space between "paragraghs."

</P>
Edited by Jupiter 2 because: typas
Member Avatar for Alxandr

It's not an end break tag (the / is at the end of the tag). Whenever (in XHTML as said) you have empty tags (like br, hr, img and meta) you should close them using the shorthand-syntax. <p id="a1"></p> is in theory equivalent to <p id="a1" /> . Problem is that tags that aren't normaly empty by some reason isn't read as XHTML (this might be because XHTML requires the browser to fail if it finds errors in the markup if I'm not mistaken). But always-empty tags do require this syntax.

Therefore you have

<br />
<hr />
<img href="..." />
etc.

And one more thing, all tagnames and attributes should be lowercase.

Member Avatar for Baradaran

I think you have forgotten to close the container div. Your code should work with the div closed!

Member Avatar for Jupiter 2

I looked up XHTML and the closing bracket is correct. I'm an old hack from way back and just used to old HTML code.
In Post #4, the 2nd line refers to a closing td but no open td? Maybe somewhere above that you did not inlcude?

<tr>
	<td />	
[\CODE]
[CODE}
<td colspan='3' style=\"padding-bottom:4px\">		
style= \"padding .... Shouldn't the Quote marks start before the backslash?

I"m new to this so I'm only making suggestions. I'm a bit out of my depth with xhtml. I still use HTML hard code by hand so xhtml is not part of my repertoire.

This is my last post on this subject.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.