JavaScript search form with enter key and open in new tab

Question

I tried to modify some search form script with multiple URL, everything is ok but I want to be able to activate the "enter key" button and "open in new tab" for this searchform. any solution/suggestion for this?

Thanks,

function startSearch(){
searchString = document.searchForm.searchText.value; 
if(searchString != ""){
searchEngine = document.searchForm.whichEngine.selectedIndex + 1;
finalSearchString = "";

if(searchEngine == 1){
finalSearchString = "https://perpus.or.id/?post_types=&s=" + searchString;
}
if(searchEngine == 2){
finalSearchString = "https://brwa.or.id/search?q=" + searchString;
}
if(searchEngine == 3){
finalSearchString = "https://madaniberkelanjutan.id/hasil-pencarian/" + searchString;
}
if(searchEngine == 4){
finalSearchString = "https://jkpp.org/?s=" + searchString;
}
if(searchEngine == 5){
finalSearchString = "https://www.econusa.id/id/search?search_flag=1&txtsearch=" + searchString + "&x=0&y=0";
}
if(searchEngine == 6){
finalSearchString = "https://www.aman.or.id/?s=" + searchString;
}

location.href = finalSearchString;
}

}

<form name="searchForm" target="_blank" method="get">

<table align="center" border cellpadding=3 cellspacing=2 >

<td ><input style="background: none" name="searchText" type="text" placeholder="Search Keyword...">
<td >
<select style="background: 000000" name="whichEngine" type="radio">
<option selected>Perpustakaan
<option>BRWA
<option>Madani Berkelanjutan
<option>JKPP
<option>Econusa
<option>AMAN
</select>
<td bgcolor=navajowhite><input type="button" value="Search" onClick="startSearch()" formtarget="_blank">
</select>
</table>
</form>

Answer 1

Onkey enter try this:

function runOnEnter(e){
    if(e.keyCode === 13){
        e.preventDefault(); // Ensure it is only this code that runs

        startSearch();
    }
}

<td bgcolor=navajowhite><input type="button" value="Search" 
 onkeypress="runOnEnter(event)"
 onClick="startSearch()" formtarget="_blank">

And to open in new tab try:

window.open(finalSearchString, '_blank');

Answer 2

Getting search text

You should get search text like this

searchString  = document.querySelector('[name="searchText"]').value

Getting engine

You should get search engine index like this

searchEngine  = document.querySelector('[name="whichEngine"]').value

Close option tags and add value attribute

Also close option tags and add value attribute to your options tags, for example

<option value="1">BRWA</option>

If you are lazy you do the follwing:

<option value="https://brwa.or.id/search?q=">BRWA</option>

(Do this for other options)

Then in startSearch() do something like this:

function startSearch(){
   searchString  = document.querySelector('[name="searchText"]').value
   searchEngine  = document.querySelector('[name="whichEngine"]').value
   finalSearchString = searchEngine + searchString;
   window.open(finalSearchString, "_blank");  // This opens in new tab
}

Your complete code will be something like this

function startSearch(){
   searchString  =     document.querySelector('[name="searchText"]').value
   searchEngine  = document.querySelector('[name="whichEngine"]').value
   finalSearchString = searchEngine + searchString;
   window.open(finalSearchString, "_blank");  // This opens in new tab
}

<form name="searchForm" target="_blank" method="get">

<table align="center" border cellpadding=3 cellspacing=2 >

<td ><input style="background: none" name="searchText" type="text" placeholder="Search Keyword...">
<td >
<select style="background: 000000" name="whichEngine" type="radio">
<option value="https://perpus.or.id/?post_types=&s=" selected>Perpustakaan</option>
<option value="https://brwa.or.id/search?q=" >BRWA</option>
<option value="https://madaniberkelanjutan.id/hasil-pencarian/" >Madani Berkelanjutan</option>
<option value="https://jkpp.org/?s=" >JKPP</option>
<option value="https://www.econusa.id/id/search?search_flag=1&txtsearch=" >Econusa</option>
<option value="https://www.aman.or.id/?s=" >AMAN</option>
</select>
<td bgcolor=navajowhite><input type="button" value="Search" onClick="startSearch()" formtarget="_blank">
</select>
</table>
</form>