Muskogeee Muskogeee - 2 months ago 15
Javascript Question

Redirect to specific url based on user input but if no pre-defined keyword exists search the site

ok so, second question here, let me start by saying I know NOTHING about javascript yet, everything I use is just cut and paste from here and there, so go easy on me :-p.

I have a customer who wants to set up a search box and if someone types in a certain pre defined keyword it goes to a specific page. I grabbed this code off of here to accomplish that part:

<form id='formName' name='formName' onsubmit='redirect();return false;'>
<input type='text' id='userInput' name='userInput' value=''>
<input type='submit' name='submit' value='Submit'>
</form>

<script type='text/javascript'>
function redirect() {
var input = document.getElementById('userInput').value.toLowerCase();
switch(input) {
case 'keyword1':
window.location.replace('page1.html');
break;
case 'keyword2':
window.location.replace('page2.html');
break;
default:
window.location.replace('error.html');
break;
}


}
</script>


Now I am also using the sphider php search script, which I have using this embedded form:

<form action="search/search.php" method="get">
<input type="text" name="query" id="query" value="SEARCH" columns="2"
autocomplete="off" delay="1500"
onfocus="if(this.value==this.defaultValue)this.value=''"
onblur="if(this.value=='')this.value=this.defaultValue" >
<input type="submit" value="" id="submit">
<input type="hidden" name="search" value="1">
</form>


Is there any way I can combine the two so that if they search for the predefined keyword they get directed to the correct page but then if their search doesn't contain a predefined keyword it searches with sphider?

Sorry if this question is ludicrous, like I said, I'm new :-p

Thanks

Answer

Update : Ok so the problem was just that you had to do a return redirect(); to ensure the false returns correctly. I made a fiddle here : http://jsfiddle.net/3UbLa/1/


I'm don't know anything about sphider search but from what you posted you should be able to combine the two like below:

Your JS will change like this:

<script type='text/javascript'>
        function redirect() {
           //look for text inside the NEW textbox
           var input = document.getElementById('query').value.toLowerCase();
            switch(input) {
                case 'keyword1':
                   //put this to see if this code runs 
                   //alert("Test");// UNCOMMENT THIS
                    window.location.replace('page1.html');
                    break;
                case 'keyword2':
                    window.location.replace('page2.html');
                    break;
                default://no keyword detected so we submit the form.
                    return true;
                    break;
            }
            return false;//don't let the form submit
        }
</script>

Your html will change to :

<form action="search/search.php" method="get" 
                              onsubmit='return redirect();'>
<!-- pretty much the same thing except you remove the return false  !-->
<input type="text" name="query" id="query"  value="SEARCH" columns="2" 
autocomplete="off" delay="1500"  
onfocus="if(this.value==this.defaultValue)this.value=''" 
onblur="if(this.value=='')this.value=this.defaultValue" >
<input type="submit" value="" id="submit">
<input type="hidden" name="search" value="1">
</form> 
Comments