snavebelac
asked on
Jumping to a named anchor ifit exists
I have a long list which is dynmically created from a database. Durin gthe list creation a named anchor is created to mark each item in the list. The named anchors are unique codes.
i want the user to be able to enter one of the codes in a text box (the user will know the code), click a link or button and have the page jump to the named anchor.
I have thrown together a scripit from several sources but I am unable to get it to work on multiple browsers. It works just fine in IE. In netscape it always fails to find the named anchor and in firefox it just does nothing.
Here is my Javascript function
function gotoAgent(myAnchor) {
var found = false;
var theAnchor = document.getElementById(my Anchor).va lue.toUppe rCase();
for (i in document.anchors) {
if (document.anchors[i].name == theAnchor) {
found = true;
if (document.layers) {
scrollTo(0,parent.main.doc ument.anch ors[theAnc hor].y);
}
else {
alert('else: '+theAnchor);
if (document.all) {
document.all[theAnchor].sc rollIntoVi ew();
}
}
return false;
//document.location.href=' agents.asp #'+theAnch or;
}
}
if (!found) {
alert('Agent '+theAnchor+' not found');
}
return false;
}
Here is my implementation . .
<input name="txtAnchor" id="txtAnchor" type="text" value="" size="8" maxlength="4">
<a href="#" onclick="javascript:gotoAg ent('txtAn chor');ret urn false;">Goto Agent</a>
Any thoughts on how this can be achieved cross browser or a better way to do this.
Thanks in advance.
C
i want the user to be able to enter one of the codes in a text box (the user will know the code), click a link or button and have the page jump to the named anchor.
I have thrown together a scripit from several sources but I am unable to get it to work on multiple browsers. It works just fine in IE. In netscape it always fails to find the named anchor and in firefox it just does nothing.
Here is my Javascript function
function gotoAgent(myAnchor) {
var found = false;
var theAnchor = document.getElementById(my
for (i in document.anchors) {
if (document.anchors[i].name == theAnchor) {
found = true;
if (document.layers) {
scrollTo(0,parent.main.doc
}
else {
alert('else: '+theAnchor);
if (document.all) {
document.all[theAnchor].sc
}
}
return false;
//document.location.href='
}
}
if (!found) {
alert('Agent '+theAnchor+' not found');
}
return false;
}
Here is my implementation . .
<input name="txtAnchor" id="txtAnchor" type="text" value="" size="8" maxlength="4">
<a href="#" onclick="javascript:gotoAg
Any thoughts on how this can be achieved cross browser or a better way to do this.
Thanks in advance.
C
ASKER
This code does not produce any errors but nothing happens in any borwser now . . .
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
This tests good in NN4.7, FF1.0PR, and IE6 (latest) on XP.
FUNCTION:
-------------------------- ---------- ---------- -----
function jump(){
document.location.hash=doc ument.frm. txt.value;
}
FORM:
-------------------------- ---------- ---------- -----
<form name="frm" id="frm">
<input type="text" name="txt" id="txt">
<input type="button" name="btn" id="btn" value="Jump" onclick="jump();">
</form>
FUNCTION:
--------------------------
function jump(){
document.location.hash=doc
}
FORM:
--------------------------
<form name="frm" id="frm">
<input type="text" name="txt" id="txt">
<input type="button" name="btn" id="btn" value="Jump" onclick="jump();">
</form>
tested on:
IE 6.0
mozilla 1.6
firefox 1.0
netscape 7.1
opera 7.54
========================== ====
<script>
function gotoAgent(myAnchor)
{
var a=document.anchors;
for(var i=0;i<a.length;i++)
{
if(eval("a[i].name.match(/ "+myAnchor +"/i)"))
{
location="#"+myAnchor;
return false;
}
}
alert('Agent '+theAnchor+' not found');
return false;
}
</script>
<a href="#" onclick="javascript:gotoAg ent('txtAn chor');ret urn false;">Goto txtAnchor</a><br>
<a href="#" onclick="javascript:gotoAg ent('txtAn chor2');re turn false;">Goto txtAnchor2</a><br>
<a href="#" onclick="javascript:gotoAg ent('txtAn chor3');re turn false;">Goto txtAnchor3</a><br>
<a href="#" onclick="javascript:gotoAg ent('txtAn chor4');re turn false;">Goto txtAnchor4</a><br>
<br><img src="" width=1 height=1500><br>
<a name=txtAnchor>txtAnchor</ a><br><img src="" width=1 height=1000><br>
<a name=txtAnchor2>txtAnchor2 </a><br><i mg src="" width=1 height=1000><br>
<a name=txtAnchor3>txtAnchor3 </a><br><i mg src="" width=1 height=1000><br>
<a name=txtAnchor4>txtAnchor4 </a><br><i mg src="" width=1 height=1500><br>
IE 6.0
mozilla 1.6
firefox 1.0
netscape 7.1
opera 7.54
==========================
<script>
function gotoAgent(myAnchor)
{
var a=document.anchors;
for(var i=0;i<a.length;i++)
{
if(eval("a[i].name.match(/
{
location="#"+myAnchor;
return false;
}
}
alert('Agent '+theAnchor+' not found');
return false;
}
</script>
<a href="#" onclick="javascript:gotoAg
<a href="#" onclick="javascript:gotoAg
<a href="#" onclick="javascript:gotoAg
<a href="#" onclick="javascript:gotoAg
<br><img src="" width=1 height=1500><br>
<a name=txtAnchor>txtAnchor</
<a name=txtAnchor2>txtAnchor2
<a name=txtAnchor3>txtAnchor3
<a name=txtAnchor4>txtAnchor4
ASKER
Thanks devic your previous post worked just as required. The only change I had to make was to convert to upper case as that is the case of all the anchors.
C
C
snavebelac,
this:
a[i].name.toLowerCase()==m yAnchor.to LowerCase( )
and this:
a[i].name.toUpperCase()==m yAnchor.to UpperCase( )
is the same thing, if you want to check two strings.
thank you!
this:
a[i].name.toLowerCase()==m
and this:
a[i].name.toUpperCase()==m
is the same thing, if you want to check two strings.
thank you!
ASKER
quite right devic
I should have been more specific. Anchors are case sensitive in some browsers so I had to convert it to upper case:
location="#"+myAnchor.toUp perCase();
all the anchors are in upper case so, if the code was enbtered lower case it would not be found in NN or FF at least.
thanks again for your help
C
I should have been more specific. Anchors are case sensitive in some browsers so I had to convert it to upper case:
location="#"+myAnchor.toUp
all the anchors are in upper case so, if the code was enbtered lower case it would not be found in NN or FF at least.
thanks again for your help
C
you are welcome
========================
<script>
function gotoAgent(myAnchor)
{
var a=document.getElementsByTa
for(var i=0;i<a.length;i++)
{
if(a[i].name==myAnchor)
{
location="#"+myAnchor;
return false;
}
}
return false;
}
</script>