connecting a database

Ask the community
,
1

Would anybody be able to help me determine what issue I am having with my code for connecting a search button to a database? Below is my code.

The search button appears to have no functionality. My table displays all results from the collection/dataset instead of refining results. The page contains a user input, a button, and a table.

I copied and pasted from a VELO tutorial. I have limited / no coding experience except for what’s posted below.

import wixData from “wix-data” ;
export function searchButton_click ( event )
{ wixData . query ( “VaultSearch” )
. contains ( “title” , $w ( “#search” ). value )
. find ()
. then ( res => { $w ( “#results” ). rows = res . items ;
});}
$w . onReady ( function () {
$w ( “#results” ). columns = [
{
“id” : “col1” ,
“dataPath” : “title” ,
“label” : “Name” ,
“width” : 100 ,
“type” : “string” ,
},
{ “id” : “col2” ,
“dataPath” : “url” ,
“label” : “URL” ,
“width” : 100 ,
“type” : “string” ,},
{ “id” : “col3” ,
“dataPath” : “vault” ,
“label” : “Vault” ,
“width” : 100 ,
“type” : “string” ,},
}];
});

2

You will need to do it some kind of this way…

import wixData from 'wix-data';
import wixUsers from 'wix-users';

$w.onReady(async()=>{ 
  $w("#myTableIDhere").columns = [//TABLE-SET-UP is CORRECT ?
    {"id":"col1","dataPath":"title","label":"Name","width":100,"type":"string"},
    {"id":"col2","dataPath":"url","label":"URL","width":100,"type":"string"},
    {"id":"col3","dataPath":"vault","label":"Vault","width":100,"type":"string"}
  ];
   
  $w('#searchButton').onClick(()=>{
     myFunction();
  });
});

function myFunction(){
  let DATABASE = "VaultSearch"
  let DATAFIELD = "title"
  let VALUE = $w("#search").value
 
  wixData.query(DATABASE)
 .contains(DATAFIELD,VALUE)
 .find()
 .then((results) => {
   if(results.items.length > 0) {console.log("ITEMS: "; results.items)
     let firstItem = results.items[0]; console.log("FIRST-ITEM: ", firstItem)
     let secondItem = results.items[1]; console.log("SECOND-ITEM: ", secondItem)
     let thirdItem = results.items[2]; console.log("THIRDT-ITEM: ", thirdItem)
     let title = results.items[0].title; console.log("TITLE: ", title)
     
     $w("#myTableIDhere").rows = res.items;
 
   //What to do next???????
   //Continue here, now it''s your turn....
   //....your code 
   //...countinue
   //..here
   //.
   //
 
   } else { }
 })
 .catch((err) => {let errorMsg = err;});
}
 
 
//OUTPUT-EXAMPLE:
//------------------- 
/*  firstItem is:
 *
 *  {
 *    "_id":          "00001",
 *    "_owner":       "ffdkj9c2-df8g-f9ke-lk98-4kjhfr89keedb",
 *    "_createdDate": "2017-05-24T12:33:18.938Z",
 *    "_updatedDate": "2017-05-24T12:33:18.938Z",
 *    "title":        "Mr.",
 *    "first_name":   "John",
 *    "last_name":    "Doe"
 *  }
 */

Not tested. You will perhaps have to optimize and modify it a little bit.

Good luck!