Search input doesn't clear when I backspace

Ask the community
,
1

Hello, I’ve created a custom search bar that I’ve created via Wix Training Academy’s video here: https://youtu.be/D-zzHTng-mw
and everything works fine! No coding trouble, However, every time i test it out, my search bar on my results page doesn’t clear out the search input that I’ve entered in on the homepage code (as followed by the video)

And my input placeholder text doesn’t appear due to this. Does anyone know how to completely wipe out the input field once the word has been backspaced?

2

I think because he is using Wix Local Storage. …
Instead use Wix Session Storage

3

Hello! Thank you for taking the time to respond! Unfortunately, it still doesn’t work when I modified my code;

import { session } from ‘wix-storage’ ;

import wixLocation from ‘wix-location’ ;

$w.onReady( function () {

});

export function searchButton_click(event, $w) {
let word = $w( “#searchBar” ).value;
session.setItem( “searchWord” , word);
wixLocation.to(/results);
}

and here is the results page code where my placeholder text doesn’t appear when I backspace;

import { session } from ‘wix-storage’ ;

import wixData from ‘wix-data’ ;

$w.onReady( function () {

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

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

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

$w( '#dataset1' ).onReady( **function**  () { 

    search(); 

});

});

export function searchButton_click() {

search();

}

function search() {

wixData.query( 'MyBlog' ) 

    .contains( 'name' , $w( "#searchBar" ).value) 

    .or(wixData.query( 'MyBlog' ).contains( 'aboutText' , $w( "#searchBar" ).value)) 

    .find() 

    .then(res => { 

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

    });

}

I personally think it’s the input value of searchWord because when I delete the word or refresh my page it’s still there.

4

@rayshrink Even you press the backspace you will see the world because the word is also set the placeholder of the input

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

If you remove the above line, the word will disappear…

Also there is something in your code you should correct

.then(res => {

Change the above into → 

.then((res) => {