Dear All,

With help from you all, I have a successful instant search on the current draft of our website. I'd love help with three minor issues of following convention:

1) Clicking on your link of choice brings about its appearance in another window -- that makes going back difficult and confusing. What can I do to add to the script (or php) to make the new link appear in the same window?

2) At the moment, to move out of the search box and down the list of choices one uses the tab key (or even worse the shift-tab to go up). How can I "bind" the script (or do whatever) to allow the down and up keys to move the focus down and up (and stopping at the bottom and top) just as it happens in Google.

3) Following up on #2, it also would be lovely, as you arrow down and up, if the choice that you're on would "light up" in some way just as it does when you hover with the mouse. Would I add something to the css in the html section of the code?

You can see the problems in action with fake data at:

http://www.woofwoofwoof.org/is01/search.htm

I'm a relative newbie at java and php. Thank you so much for your time and expertise. -- Dr C.

Here's the relevant script and php code:

<script type="text/javascript">
function showResult(str)
{
if (str.length==0)
  { 
  document.getElementById("livesearch").innerHTML="";
  document.getElementById("livesearch").style.border="0px"

  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
    document.getElementById("livesearch").style.fontFamily="Arial";
    }
  }
xmlhttp.open("GET","livesearch.php?q="+str,true);
xmlhttp.send();
}
</script>

And the PHP:

<?php
$xmlDoc=new DOMDocument();
$xmlDoc->load("links.xml");

$x=$xmlDoc->getElementsByTagName('link');

//get the q parameter from URL
$q=$_GET["q"];

//lookup all links from the xml file if length of q>0
if (strlen($q)>0)
{
$hint="";
for($i=0; $i<($x->length); $i++)
  {
  $y=$x->item($i)->getElementsByTagName('title');
  $z=$x->item($i)->getElementsByTagName('url');
  if ($y->item(0)->nodeType==1)
    {
    //find a link matching the search text
    if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q))
      {
      if ($hint=="")
        {
        $hint="<a href='" . 
        $z->item(0)->childNodes->item(0)->nodeValue . 
        "' target='_blank'>" . 
        $y->item(0)->childNodes->item(0)->nodeValue . "</a>";
        }
      else
        {
        $hint=$hint . "<br /><a href='" . 
        $z->item(0)->childNodes->item(0)->nodeValue . 
        "' target='_blank'>" . 
        $y->item(0)->childNodes->item(0)->nodeValue . "</a>";
        }
      }
    }
  }
}

// Set output to "no suggestion" if no hint were found
// or to the correct values
if ($hint=="")
  {
  $response="no suggestion";
  }
else
  {
  $response=$hint;
  }

//output the response
echo $response;
?> 

--end --

Thanks to the miracle of the internet, the link above for you to see the problem in action brings about 2 new windows -- one is junk (close it) and then you'll see the real one.

well first thing's first:
<a href="http://www.supportworks.org" target="_blank">HTML SupportWorks Home Page</a>

You need to delete the damn target="_blank" from your links.

On the line 27 of your code remove target='_blank' this.

Dear Troy & kris,

Two quick questions:

1) [Both of you] Do you mean for me to totally eliminate line 27 of the PHP?

2) [Troy] Am I right that you're pointing out the <a href...> structure just a general hint for me rather than as something to plug into the code above?

Thanks for continuing to take the time to help out.

DrC

You're late!
Anyway, while at it, -every link (generated or not) contains the target (_blank) attribute, which will force the link to navigate on a popup window.
You'll need to correct/remove that.

Dear Troy,

Thanks for your quick reply. I removed line 27, line 34, and both. Removing line 27 disabled the instant search and line 34 going out partially disabled the search.

I understand what you're saying, but I don't know how to correct the code. If the precise code with referenced line numbers referencing above magically appears, please do send it here. I'm a newbie and really don't know how to correct a target in PHP.

Thanks!

DrC

well than - you'll need to patch

 if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
document.getElementById("livesearch").style.fontFamily="Arial";
a = livesearch.getElementsByTagName("a");
i = 0; while(a[i])a[i++].removeAttribute("target");
}

I didn't receive an email notification of your last note Troy so I didn't have the opportunity to give it a try. We solved the problem by changing (duh) _blank to _self. I was an inch away from a solution and had made that simple html mistake.

The other problem remains annoying for helping sighted and screen reading visitors. Do you have any ideas about binding the arrow key to make the search process closer to the Google conventions? I couldn't find any code that "bound" the tab key that would be useful in this situation. As with the window issue, I'm hoping that I'm just missing something simple. Thanks. - Dr. C.

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.