Im trying to do a search on my database using an text input, a buttton and a table as shown in this tutorial.
https://support.wix.com/en/article/velo-tutorial-adding-collection-data-search-functionality
import wixData from “wix-data”
export function btnbuscar_click ( event ) {
search ()
}
export function search ( ) {
wixData . query ( “Servicios” )
. contains ( “title” , $w ( ‘#inputM’ ). value )
. find ()
. then ( results => {
$w ( ‘#table1’ ). rows = results . items ;
$w ( ‘#table1’ ). expand ();
});
$w . onReady ( function () {
$w ( “#table1” ). columns = [
{
“id” : “col1” , // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath” : “title” ,
“label” : “Matricula” , // The column header
“width” : 100 , // Column width
“type” : “string”
}];
});
}
My database collection is Servicios.
I haven’t connected the table to the dataset, should i? Cause when i do i get all the data unfiltered.
No, i would not recommend to connect a dataset and mix it with a version of Wix-Data-API.
Go either the DATASET-WAY, or do it with Wix-DATA-API. Do not start to mix them.
import wixData from "wix-data"
let searchWord
$w.onReady(()=>{
$w('#inputM').onChange(()=>{
searchWord=$w('#inputM').value;
});
$w('#btnbuscar').onClick(()=>{
let items = await startSerachEngine(searchWord);
if items.length > 0 {
console.log("Congratulation you found some data!");
console.log(items);
console.log(items[0]);
console.log(items[0].title);
console.log(items[0]._id);
}
else {console.log("Nothing found!");}
});
});
function startSearchEngine(searchWord) {
return wixData.query("Servicios")
.contains("title", searchWord)
.find().then(res=>{
let items = res.items
if items.lenght >0 {console.log("Some data has been found");}
else {console.log("No data has been found!")}
return items
})
.catch((err)=>{console.log("We have a problem! ---> " + err);});
}
Take a look onto example-code.
Modify it by your own needs.
Have fun.
Hello!
I’ve tried your code, added some () and corrected a typo.
import wixData from “wix-data”
let searchWord
$w . onReady (()=>{
$w ( ‘#inputM’ ). onChange (()=>{
searchWord = $w ( ‘#inputM’ ). value ;
});
$w ( ‘#btnbuscar’ ). onClick (()=>{
let items = startSearchEngine ( searchWord );
if ( items . length > 0 ){
//THIS .LENGTH IS NOT WORKING BECAUSE OF LET ITEM = FUNCTION
console . log ( "Congratulation you found some data!" );
console . log ( items );
console . log ( items [ 0 ]);
console . log ( items [ 0 ]. title );
console . log ( items [ 0 ]. _id );
}
**else** { console . log ( "Nothing found!" );}
});
});
function startSearchEngine ( searchWord ) {
return wixData . query ( “Servicios” )
. contains ( “title” , searchWord )
. find (). then ( res =>{
let items = res . items
if ( items . length > 0 ) { console . log ( “Some data has been found” );}
else { console . log ( “No data has been found!” )}
return items
})
. catch (( err )=>{ console . log ( "We have a problem! —> " + err );});
}
Yes, i did never test it or debuged any typos, thats right.
I had not the time to do that.
I assume, that the code did not work ?
Maybe because i forgot a → ASYNC-AWAIT ?
The - → AWAIT ← - - was already there, but the second part of it - - > ASYNC ← -
i forgot to implement into the code.
//THIS .LENGTH IS NOT WORKING BECAUSE OF LET ITEM = FUNCTION
$w('#btnbuscar').onClick(async()=>{
let items = await startSearchEngine(searchWord);
Before you can use the results, the results have first to be ready.
Even a MACHINE needs some time to generate RESULTS.
So back to the ERROR. When you try to ask for results, before they are ready to be used - → of course you get no length, because there is nothing to get yet. 
What exact error do you get?
What does not work?
Do you get results already?
Next time please try to give a more detailed answer.
Oh ok, i see. Thanks for the answer.
Now i dont get an error, but i dont get the results either.
I get “No data has been found! , Nothing found!” but im searching for a ‘title’ i know its in the collection(its a string).
Also, even if i dont directly connect the table to the dataset, i should have the dataset on the page?
Do everything STEP-BY-STEP.
First get your RESULTS.
To have control over RESULTS → you have the → CONSOLE <—
When you have your results, you will have to connect them with your TABLE or better → REPEATER.
A REPEATER is the new and upgraded TABLE.
You already did it in your previous code…
$w('#table1').rows=results.items;
$w("#table1").columns=[{ "id": "col1",// ID of the column for code purposes// The field key in the collection whose data this column displays "dataPath": "title", "label": "Matricula",// The column header "width":100,// Column width "type": "string" }];
});
Ok, i get it now, but i still dont get the results. i dont know what am i missing
import wixData from “wix-data”
let searchWord
$w . onReady (()=>{
$w ( ‘#inputM’ ). onChange (()=>{
searchWord = $w ( ‘#inputM’ ). value ;
});
$w ( '#btnbuscar' ). onClick ( **async** ()=>{
**let** items = **await** startSearchEngine ( searchWord );
**if** ( items . length > 0 ){
console . log ( "Congratulation you found some data!" );
console . log ( items );
console . log ( items [ 0 ]);
console . log ( items [ 0 ]. title );
console . log ( items [ 0 ]. _id );
}
**else** { console . log ( "Nothing found!" );}
});
});
function startSearchEngine ( searchWord ) {
return wixData . query ( “Servicios” )
. contains ( “title” , searchWord )
. find (). then ( res =>{
let items = res . items
if ( items . length > 0 ) { console . log ( “Some data has been found” );}
else { console . log ( “No data has been found!” )}
return items
})
. catch (( err )=>{ console . log ( "We have a problem! —> " + err );});
}
Here some UPGRADED-VERSION…
import wixData from "wix-data"
let searchWord
$w.onReady(()=>{
$w('#input1').onChange(()=>{
searchWord=$w('#input1').value;
});
$w('#btnbuscar').onClick(async()=>{
let items = await startSearchEngine(searchWord);
console.log("ITEMS: ", items);
if (items[0]){
console.log("Yeahaaa! You found some data!");
console.log("Items: ", items);
console.log("ITEM-1: ", items[0]);
console.log("Title: ", items[0].title);
console.log("ID: ", items[0]._id);
}
else {console.log("Nothing found!");}
});
});
function startSearchEngine(searchWord) {
return wixData.query("Servicios")
.contains("title", searchWord)
.find().then(res=>{console.log("RES: ", res._totalCount);
let items = res.items
if (res._totalCount > 0) {return items}
else {items=[]; return items}
})
.catch((err)=>{console.log("We have a problem! ---> " + err);});
}
I asume, there were done some changes inside of the RESULT-OBJECT.
On my opinion, in the past, you could find —> length <— parameter.
Now it is changed to —> _totalCount (NEW).
I could successfully test this CODE on my own example-Database.