Export Function on key enter, not on click

Question:
Hi all,

I have a search function that begins in the master js and then moves to a results page. It works well. However, I would like the search on the results page to be triggered by hitting enter, rather than clicking a button. I’m fairly sure I need to change the export function, but I can’t find a script that works.

Does anyone have any ideas please?

Product:
Wix Editor

import {local} from ‘wix-storage’;

import wixData from ‘wix-data’;

$w.onReady(function () {

var sameWord = local.getItem("searchWord");

$w("#searchBarHeader").value = sameWord;

$w("#searchBarHeader").placeholder = sameWord;

$w('#SchoolSearch').onReady(function () {

    search();

});

});

export function searchButton_click

() {

search();

}

function search() {

wixData.query('IndepedentSchoolExams')

.contains(‘title’, $w(“#searchBarHeader”).value)

.or(wixData.query(‘Name’).contains(‘schoolName2’, $w(“#searchBarHeader”).value))

  .find()

   .then(res => {

$w(‘#repeater1’).data = res.items;

});

}

import {local} from 'wix-storage';
import wixData from 'wix-data';

$w.onReady(()=> {console.log('Page is ready...');
    const DATASET = $w('#SchoolSearch');
    const sameWord = local.getItem("searchWord");
    $w("#searchBarHeader").value = sameWord;
    $w("#searchBarHeader").placeholder = sameWord;
    
    DATASET.onReady(()=> {search();
        $w('#searchButton').onClick(()=>{
            search();
        });
    });

    $w("#input1").onKeyPress((event) => {
        if(event.key === "Enter"){
            search();
        }
    });    
});


function search() {
    wixData.query('IndepedentSchoolExams')
    .contains('title', $w('#searchBarHeader').value)
    .or(wixData.query('Name').contains('schoolName2', $w('#searchBarHeader').value))
    .find().then((res)=> {
        const items = res.items;
        if(items.length>0) {console.log('Items have been found!!!');
            $w('#repeater1').data = res.items;
        }
        else {console.log('No items found!!!');}            
    }).catch((err)=>{console.log(err);});
}

This is superb and I am extremely grateful, thank you

Mark it as → SOLUTION ← if you found your solution in it.

Hi Dima,

Yes I will do.

Unfortunately upon publishing we seem to have the opposite problem.

Searching on the search-results page works perfectly. However, the search-results page is not pulling through the keyword from the master js.

Apologies I thought we were done :slight_smile:

Here is the code on the master js

import {local} from ‘wix-storage’;

import wixLocation from ‘wix-location’;

$w.onReady(()=> {
$w(‘#searchBarHeader’).onKeyPress((event)=> {
if(event.key === ‘Enter’){
let word = $w(‘#searchBarHeader’).value;
local.setItem(‘searchWord’, word);
wixLocation.to(/school-search);
}
});
});

Here is the code on the search-results page

import {local} from ‘wix-storage’;
import wixData from ‘wix-data’;

$w.onReady(()=> {console.log(‘Page is ready…’);
const DATASET = $w(‘#SchoolSearch’);
const sameWord = local.getItem(“searchWord”);
$w(“#searchBarHeader”).value = sameWord;
$w(“#searchBarHeader”).placeholder = sameWord;

search();

$w("#searchBarHeader").onKeyPress((event) => {
    if(event.key === "Enter"){
        search();
    }
});    

});

function search() {
wixData.query(‘IndepedentSchoolExams’)
.contains(‘title’, $w(‘#searchBarHeader’).value)
.or(wixData.query(‘IndepedentSchoolExams’).contains(‘schoolName2’, $w(‘#searchBarHeader’).value))
.find().then((res)=> {
const items = res.items;
if(items.length>0) {console.log(‘Items have been found!!!’);
$w(‘#repeater1’).data = res.items;
}
else {console.log(‘No items found!!!’);}
}).catch((err)=>{console.log(err);});
}

If anyone else comes across this, the below is what worked

import {local} from ‘wix-storage’;
import wixData from ‘wix-data’;

$w.onReady(function () {

var sameWord = local.getItem(“searchWord”);

$w(“#searchBarHeader”).value = sameWord;

$w(“#searchBarHeader”).placeholder = sameWord;

$w(‘#SchoolSearch’).onReady(function () {

search();

});

$w("#searchBarHeader").onKeyPress((event) => {
    if(event.key === "Enter"){
        search();
    }
});    

});

function search() {
wixData.query(‘IndepedentSchoolExams’)
.contains(‘title’, $w(‘#searchBarHeader’).value)
.or(wixData.query(‘IndepedentSchoolExams’).contains(‘schoolName2’, $w(‘#searchBarHeader’).value))
.find().then((res)=> {
const items = res.items;
if(items.length>0) {console.log(‘Items have been found!!!’);
$w(‘#repeater1’).data = res.items;
}
else {console.log(‘No items found!!!’);}
}).catch((err)=>{console.log(err);});
}

1 Like