Search By Filter Implementation
From Ka-Map Wiki
Contents |
[edit] Goal
The objective of this wiki page is to explain, in a quite easy way, how to add a search filter fuction (e.g. "search a text string by table_name") to the default search system of the Ka-Map framework. We will use the CVS code for searching because it fixes a problem with the PostGIS layers. So, if you plan to use PostGIS tables, get Ka-Map from cvs!
Before you start, prepare a classical Ka-Map application and include some searchable layers in your mapfile (Search_System).
[edit] Involved files
- Your favourite HTML Ka-Map Template;
- KaSearch.php (path: htdocs/tools/search);
- KaSearch.js (path: htdocs/tools/search).
[edit] Editing HTML
In this example we are going to modify the ominiverdi's index.html (KaExplorer user interface). Open the file with your faourite text editor and locate this section:
<div id="search">
<h3>Search</h3>
<hr>
<h5>Use this form to search places in the database</h5>
<form name="search" action="javascript:myKaSearch.search(document.forms['search'].elements['searchstring'].value);">
<!--<label for="searchstring">text to search:</label>-->
<input type="text" name="searchstring" style="width:90px;">
<button type="button" onClick="myKaSearch.search(document.forms['search'].elements['searchstring'].value)">Go!</button>
</form>
<hr>
<div id="searchres"> </div>
</div><!-- end identifier -->
modify it by inserting a <select> tag using your postgis tables/shapefiles names as <option> values:
<div id="search">
<h3>Search</h3>
<hr>
<h5>Use this form to search places in the database</h5>
<form name="search" action="javascript:myKaSearch.search(document.forms['search'].elements['searchstring'].value);">
<select id="searchlayer" style="width:85px">
<option value="0">Search by...</option>
<option value="my_real_table_name">My_Alias_1</option>
<option value="my_real_table_name">My_Alias_2</option>
and so on...
</select>
<!--<label for="searchstring">text to search:</label>-->
<input type="text" name="searchstring" style="width:90px;">
<button type="button" onClick="myKaSearch.search(document.forms['search'].elements['searchstring'].value)">Go!</button>
</form>
<hr>
<div id="searchres"> </div>
</div><!-- end identifier -->
[edit] Editing PHP Search code
Open the htdocs/tools/search/KaSearch.php file and do the following:
a) insert this code after the request handling (at the beginning of the file, around line 34-35)
$layer = $_REQUEST['searchlayer'];
this code puts the value of the selected option (the current "my_real_table_name"), defined in the html template, in the $layer variable
b) Add the following line
if ($layer != "0") {
$oLayer = $oMap->getLayerByName($layer);
} else {
echo "No option selected in the dropdown menu!";
die();
}
before the FOR cicle (that starts under the //LOOP ON LAYERS comment).
The getLayerByName() method uses the value of the $layer variable to "decide" in wich layer look for the user's defined searchstring
c) this is the more delicate operation (however not so difficult if you know a little php).
Comment the FOR cicle around the line 88-90 (it begins under the original //LOOP ON LAYERS comment, as we said).
Pay attention to comment also the closing "}" at the end of the cicle!
[edit] Editing AJAX Request
This is the last and easiest step!
Open the htdocs/tools/search/KaSearch.js file and do the following:
a) Add this line after the searchstring=encodeURIComponent(search_query); line:
searchlayer=document.getElementById('searchlayer').value;
b) Modify the request:
xmlhttp.open('GET', "tools/search/kaSearch.php?xmlRequest=true&map="+this.kaMap.getCurrentMap().name+"&searchstring="+searchstring, true);
in this way
xmlhttp.open('GET',"tools/search/kaSearch.php?xmlRequest=true&map="+this.kaMap.getCurrentMap().name+"&searchstring="+searchstring+"&searchlayer="+searchlayer, true);
[edit] Conclusions
This "patch" presents some "youth issues" like the needing of manually specify the layer names in the html template file.
I want to invite you to contribute and help to improve this functionality to get it packaged in a future ka-map release!

