Ed's Big Plans

Computing for Science and Awesome

URL mangling for HTML forms (a better Mediawiki search box)

with 3 comments

Followup: This is better than my previous Mediawiki search box solution because it doesn’t require an extra PHP file (search-redirect.php) to deploy. It relies completely on URL mangling inside the HTML form on the page you are putting the search box. Previous post here.

A valid HTML form input type is “hidden”. What this means is that a variable can be set without a control displayed for it in a form. Other input types for instance are “text” for a line of text and “submit” for the proverbial submit button — both of these input types are displayed. Variables set by the “hidden” input type are treated as normal and are shipped off via the GET or POST method that you’ve chosen for the whole html form…

So, to create the following mangled URL…

http://eddiema.ca/wiki/index.php?title=Special%3ASearch&search=searchterms&go=Go

There are the following variables … with the following values:

  • title … “Special%3ASearch” (%3A is the HTML entity “:”)
  • search … “searchterms” (the only variable requiring user input)
  • go … “Go”

The only variable that needs to be assigned from the form is “search” to which I’ve assigned the placeholder “searchterms” in the above URL.

The form thus needs only to take input for the variable “search” with a “text” type input, while “title” and “go” are already assigned– a job for the “hidden” type input.

Here’s what the simplest form for this would look like…

<form action="http://eddiema.ca/wiki/index.php" method="get">
Search Ed's Wiki Notebook:
<input name="title" type="hidden" value="Special:Search" />
<input name="search" type="text" value="" />
<input name="go" type="hidden" value="Go" />
<input type="submit" value="Search" />
</form>

Again, replace the text “Search Ed’s Wiki Notebook” with your own description and replace “http://eddiema.ca/wiki/index.php” with the form handler that you’re using– it’ll either be a bare domain, subdomain or could end with index.php if it’s a Mediawiki installation.

And that’s it! A far simpler solution than last time with the use of the “hidden” type input to assist in URL mangling.

Update: Here’s an even more improved version — this time, the end user doesn’t even see a page creation option when a full title match isn’t found. Demo (hooked up to my wiki) and Code below …





<form id="searchform" action="http://eddiema.ca/wiki/index.php" method="get">
<label class="screen-reader-text" for="s">Search Ed's Wiki Notebook:</label>
<input id="s" type="text" name="search" value="" />
<input name="fulltext" type="hidden" value="Search" />
<input id="searchsubmit" type="submit" value="Search" />
</form>

Notice that the variables “Special:Search” and “go” are not actually needed — instead, the variable “fulltext” is assigned the string “Search” — this causes mediawiki to hide the “You can create this page” option.

Eddie Ma

June 4th, 2010 at 8:39 am

Stefan says...

Hi Eddie,

good job!
Is it possible to add the MediaWiki search suggestion to your form? This would be perfect…

Cheers,
Stefan

Stefan says...

I think I found out for myself:
You have to add `id=”searchText”`
to the line “

Works fine on my wiki’s homepage: http://secret-wiki.de 🙂
Thanks again!

Eddie Ma says...

Thanks Stefan!

I didn’t see your comment until now — this is actually useful to me too — future project!

— Eddie