Extension talk:Search Suggest

Last letter of search term is ignored

For some reason the content of the $term parameter of wfAjaxSearchSuggest is missing the last letter. For example if I enter 'wiki' in the search box, all articles containing 'wik' are returned. You can quickly confirm this by changing the last line of that function from

return $html;

to

return $term;

and then entering some search term.

Roberthaenel 18:18, 9 March 2008 (UTC)

This is fixed now TheDevilOnLine 08:47, 20 March 2008 (UTC)

Works only with MW 1.10 ?

Hi, I wonder if this extension just works with MediaWiki 1.10 ? I'm using MW 1.11.1 and this extension works not.

Any idea?

--84.115.73.42 23:25, 10 March 2008 (UTC)

Im using it in 1.11 right now. Are you using monobook as your skin?

• if not
  • If you know where you want the results to go, you can change this in the javascript
    
  • var searchdiv = document.getElementById("searchBody");
    

Change searchBody to the id of the div you want the results to go into --Noverflow 12:37, 15 March 2008 (UTC)

^Can somebody please elaborate on the above suggestions? Thanks. ~neonsox 1525 5 May 08

I do not get it either..what id, div?? I am using the Gumax Skin as default - what should I do. I am a newbie and do not get, what is meant by div. I do not even now what to type for the monobook skin… Furthermore, at thos point it seems as the extension only works with one skin. If you could upgrade this, it would be great! Anyway - this is a very useful tool! Hope I get it started ;-) --Jorgusch 18:16, 16 June 2008 (UTC)

Notes from Bkazdan

Spaces vs Underscores

• I noticed that articles that have spaces in their names will require the underscore character. Without it the search is broken.

Bkazdan 17:24, 12 March 2008 (UTC)

Fix

Just add a little bit of code to this line:

var x = document.getElementById("searchInput").value

A little replace tag makes the replace as you type work with spaces.

var x = document.getElementById("searchInput").value.replace(/ /g , '_');

Bkazdan 17:26, 13 March 2008 (UTC)

Thought I took care of that

Sorry, I thought I had taken care of that on the php level. Ill fix it. --Noverflow 12:39, 15 March 2008 (UTC)

Suggestion: Autocomplete Replacement

• It would be great if browser autocomplete could be disabled and traded for an overlaying version of your search tool.
  • Example: Google Suggest

Bkazdan 17:28, 12 March 2008 (UTC)

Response 84.115.73.42

Hi! Have you been able to disable the browsers autocomplete feature? If so - how?

I have just tested your new code (below) and it works nearly perfect - but the search tool do not overlay the browsers autocomplete feature ... I'm not a programer and have no idea how to get rid this problem, but maybe this instructions - Disabling AutoComplete on forms - could mybe helpful.

A further "problem" is that if the search box starts to drop down below the search input field, the drop down box do not overlay the toolbar below (moves the toolbox and everything below down). Any idea how to get rid of this problem?

--84.115.73.42 21:19, 25 March 2008 (UTC)

Further Response - Neverflow

If you want, you can add autocomplete=”off” to the input box, but I think it is useful. As for the second "problem", that was actually my intention. Below someone has posted some code to have the results hover above. --Noverflow 16:33, 28 March 2008 (UTC)

Reply - Bkazdan

Neverflow is correct.

I think that adding the attribute autocomplete with the value of "off" will work. However I think it may need be added on the form element. Unfortunately it is not standard HTML. IE/Firefox both support it though.

I have been very busy integrating a vBulletin interface at the same time I am working on a new wiki. Unfortunately I haven't had that much energy to invest into this.

Ideally I would want to inject the autocomplete attribute on the fly via javascript so that the extension doesn't require any extra work. If Noverflow knows how to do this via PHP it may be a better solution.

I will try to work on this a little more in the next week.

Bkazdan 22:01, 30 March 2008 (UTC)

Changes to .js & .css for overlay

On my installation I made a few changes to the .js file and .css for an overlay effect.

Original searchsuggest.js:

if (x.length < 10 && x.length > 1) {
        sajax_do_call("wfAjaxSearchSuggest", [x], newdiv);
    }

Modified searchsuggest.js:

 if (x.length < 1 || x.value == "") {
        document.getElementById("searchsuggest").style.visibility = 'hidden';
        document.getElementById("searchsuggest").style.display = 'none';
    }
    if (x.length < 10 && x.length > 1) {
        sajax_do_call("wfAjaxSearchSuggest", [x], newdiv);
        document.getElementById("searchsuggest").style.visibility = 'visible';
        document.getElementById("searchsuggest").style.display = 'block';
    }

Original style.css

#searchsuggest {
    text-align: left;
}

#searchsuggest ul {
    list-style: none;
    margin: 0;
}

#searchsuggest li {
    padding: 2px 5px;
    white-space: nowrap;
    text-align: left;
}

#searchsuggest li:hover {
    background: #888;
    margin-left: 1em;
    text-decoration: underline;
}

Modified style.css

#searchsuggest {
    width: 15em;
    overflow: hidden;
    position: absolute;
    text-align: left;
    background: #ffffff;
    border: 1px solid #000000;
    z-index: 1;
    left: 1em;
    top: 4em;
}

#searchsuggest ul {
    margin: 0px;
    list-style: none;
}

#searchsuggest li {
    padding: 2px 5px;
    white-space: nowrap;
}

#searchsuggest li:hover {
    text-decoration: underline;
}

Bkazdan 18:58, 12 March 2008 (UTC)

Current Code

This is the current code I am using right now. It has been further modified beyond the examples above.

Current searchsuggest.js

var ss_memory = null;

function SearchCall(){
    var newdiv = document.getElementById("searchsuggest");
    if (!newdiv) {
        var newdiv = document.createElement("div");
        newdiv.id = "searchsuggest";
        var searchdiv = document.getElementById("searchBody");
        //insertAfter(newdiv,searchdiv)
        searchdiv.appendChild(newdiv);
    }
    var x = document.getElementById("searchInput").value.replace(/ /g, '_');
    if (x == ss_memory) {
        return;
    }
    ss_memory = x;
    document.getElementById("searchsuggest").style.display = 'none';
    if (x.length < 30 && x.length > 1 && x.value != "") {
        sajax_do_call("wfAjaxSearchSuggest", [x], newdiv);
        document.getElementById("searchsuggest").style.display = 'block';
        document.getElementById("searchsuggest").style.border = '1px solid #000000';
    }
}

function ss_ajax_onload(){
    var x = document.getElementById('searchInput');
    x.onkeyup = function(){
        SearchCall();
    };
}

Current Style.css

#searchsuggest {
    width: 15em;
    overflow: hidden;
    position: absolute;
    text-align: left;
    background: #ffffff;
    z-index: 1;
    left: 1em;
    top: 4em;
}

#searchsuggest ul {
    margin: 0px;
    list-style: none;
}

#searchsuggest li {
    padding: 2px 5px;
    white-space: nowrap;
}

#searchsuggest li:hover {
    text-decoration: underline;
}

Bkazdan 18:02, 13 March 2008 (UTC)

Shouldn't wfAjaxSearchSuggestHeaders() return true?

Shouldn't wfAjaxSearchSuggestHeaders() return true, so other OutputPageBeforeHTML hooks get a chance to run? Jlerner 20:08, 25 April 2008 (UTC)

See, this is where it becomes obvious Im a designer, not a programer.

--Noverflow 12:08, 26 April 2008 (UTC)

How do we make the div disapear off focus

What needs to be changed to hide the div if the user clicks outside of the text field / searchSuggest div?

TIA,

--Theothertom 23:38, 6 May 2008 (UTC)

Modified for the Cavendish skin

Does anyone know the changes needed to have this work for the Cavendish skin?

Here is the search code from cavendish.php:

  <form name="searchform" action="<?php $this->text('searchaction') ?>" id="search">
    <div>
      <label for="q"><?php $this->msg('search') ?></label>
        <input id="q" name="search" type="text" 
            <?php if($this->haveMsg('accesskey-search')) {  ?>
                    accesskey="<?php $this->msg('accesskey-search') ?>"
            <?php } if( isset( $this->data['search'] ) ) {  ?>
                      value="<?php $this->text('search') ?>"
            <?php } ?>
        />
        <input type="submit" name="go" class="searchButton" id="searchGoButton"
          value="<?php $this->msg('go') ?>" /> 
          <input type="submit" name="fulltext" class="searchButton" value="<?php $this->msg('search') ?>" />
    </div>
  </form>

Show results in "searchInput"

Hello! This is a nice extension! Is it possible to show the searchresults in the input-field named "searchInput"? It would be nice to just press the cursor-down-key to get to the results just like on wikipedia. Regards, --rhododendronbusch 12:03, 4 August 2008 (UTC)

Does not work in some pages (special pages generally)

This code does not called in some pages (/Special:Specialpages for example), SPECIAL PAGES in the general case. Therefore suggestion does not work.

$wgHooks['OutputPageBeforeHTML'][] = 'wfAjaxSearchSuggestHeaders';

But code below does. I think there in no reason to use hook.

$wgExtensionFunctions[] = 'wfAjaxSearchSuggestHeaders';

wfAjaxSearchSuggestHeaders - is the name of the function that adds js and css links to page.

This extension is not (fully) obsolete

It has been replaced by core functionality in the MediaWiki software (which was added in version 1.13.0). See Manual:$wgEnableMWSuggest for the new core feature.

$wgEnableMWSuggest does not provide the functionality to search anywhere in the article name. I posted this problem as #20237. --Wissenslogistiker 09:09, 14 August 2009 (UTC)