Database search issue

I’m building a band recruitment website that features a student portal whereby individuals can create a profile and upload an audition video, and a director’s portal whereby individuals can search those profiles for relevant matches. I’ve created the database and linked all relevant fields (save the upload video button which, I am told, does not currently allow the uploading of videos into the database; is there a solid workaround to this?). My issue comes when I try to perform the subsequent search. Following the steps in one of the wix tutorials, I created a dropdown box and connected it to both my dataset and the relevant field. I then created a table and connected it to my dataset. Unfortunately, the two don’t seem to be talking to each other. I need to create more dropdowns for more filter options, which I think I can do once I get this first one figured out. The code I’m using is:

// For full API documentation, including code examples, visit Velo API Reference - Wix.com
import wixData from ‘wix-data’;
export function dropdown1_change(event, $w) { // Runs a query on the “Members” collection
wixData.query(‘Student_Records’)
// Query the collection for any items whose “Name” field contains
// the value the user selected in the dropdown
.contains(‘instruments’, $w(‘#sInstrument’).value)
.find() // Run the query
.then(res => {
// Set the table data to be the results of the query
$w(‘#table1’).rows = res.items;
});
}
/*$w.onReady(function () {
//TODO: write your page related code here…

$w("#table1").columns = [ 
  { 
    "id": "col1",       // ID of the column for code purposes 
    // The field key in the collection whose data this column displays   
    "dataPath": "firstName",  
    "label": "First Name", // The column header 
    "width": 100,       // Column width 
    "visible": true,    // Column visibility 
    "type": "string",   // Data type for the column 
    // Path for the column if it contains a link   
    "linkPath": "link-field-or-property"   
  },   
  { 
    "id": "col2", 
    "dataPath": "lastName", 
    "label": "Last Name", 
    "width": 100, 
    "visible": true, 
    "type": "string", 
    "linkPath": "link-field-or-property" 
  }, 
  { 
    "id": "col3", 
    "dataPath": "classification", 
    "label": "Classification", 
    "width": 100, 
    "visible": true, 
    "type": "string", 
    "linkPath": "link-field-or-property" 
  }, 
  { 
    "id": "col4", 
    "dataPath": "city", 
    "label": "State", 
    "width": 100, 
    "visible": true, 
    "type": "string", 
    "linkPath": "link-field-or-property" 
  }, 
  { 
    "id": "col5", 
    "dataPath": "state", 
    "label": "State", 
    "width": 100, 
    "visible": true, 
    "type": "string", 
    "linkPath": "link-field-or-property" 
  }, 
  { 
    "id": "col6", 
    "dataPath": "video", 
    "label": "Video", 
    "width": 100, 
    "visible": true, 
    "type": "video", 
    "linkPath": "link-field-or-property" 
  } 
  ] 
  }); 

}*/

I commented out the table portion because I was told that it was conflicting with the code previous. When I run a preview, and instrument I choose from the dropdown shows up in the Instrument field of the table, but that’s all that shows up. The test data I input into my student form was for a trumpet player, however, when I select trumpet from the dropdown, the word “trumpet” shows up in the field, but none of the other data of record does. Admittedly, javascript aint my thing, so I’m confused as to what is and isn’t happening.

@djmercutio_2000

Check out this video, it might simplify the how to for you…

https://www.wixideas.com/WiX-Ideas/tiaan46/Create-an-‘Add-%26-Edit’-admin-section-for-your-WiX-Site-in-8-min’s!

Best of luck!
Tiaan

FYI - 404 not found error when clicking on the link - for some reason the exclamation point at the end wasn’t included in the hyperlink.

@smiller - thank you for the heads up!

hi, Tiaan…i appreciate your taking the time out to assist…that video, in particular, seemed geared toward a problem different from that i was having…however, one you posted later does, in part, address my initial concern…it’s the one regarding using wix data filters…i’ve studied and attempted to implement the code, but still have yet to achieve success…i was hoping you’d be able to assist…here’s what i have so far:

// For full API documentation, including code examples, visit Velo API Reference - Wix.com
import wixData from ‘wix-data’;

export function button1_click(event, $w) {
$w(‘#dataset1’).setFilter(wixData.filter()

.contains(“instruments”, $w(‘#sInstrument’).value)
.contains(“classification”, $w(‘#dropdown1’).value)
.contains(“city”, $w(‘#dropdown2’).value)
.contains(“state”, $w(‘#dropdown3’).value)
.contains(“school”, $w(‘#dropdown4’).value))

.then((res) => {
// Set the table data to be the results of the query

 $w('#table1').rows = res.items;  

})
$w(‘#table1’).show();
}

$w.onReady( function () {
//TODO: write your page related code here…

$w(“#table1”).columns = [
{
“id”: “col1”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “firstName”,
“label”: “First Name”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “string”, // Data type for the column
// Path for the column if it contains a link
“linkPath”: “link-field-or-property”
},
{
“id”: “col2”,
“dataPath”: “lastName”,
“label”: “Last Name”,
“width”: 100,
“visible”: true ,
“type”: “string”,
“linkPath”: “link-field-or-property”
},
{
“id”: “col3”,
“dataPath”: “classification”,
“label”: “Classification”,
“width”: 100,
“visible”: true ,
“type”: “string”,
“linkPath”: “link-field-or-property”
},
{
“id”: “col4”,
“dataPath”: “city”,
“label”: “State”,
“width”: 100,
“visible”: true ,
“type”: “string”,
“linkPath”: “link-field-or-property”
},
{
“id”: “col5”,
“dataPath”: “state”,
“label”: “State”,
“width”: 100,
“visible”: true ,
“type”: “string”,
“linkPath”: “link-field-or-property”
},
{
“id”: “col6”,
“dataPath”: “video”,
“label”: “Video”,
“width”: 100,
“visible”: true ,
“type”: “video”,
“linkPath”: “link-field-or-property”
}
]
});

very, very briefly, i’ll see a flash of data in the table and then it goes blank…further, aft4er having chosen a parameter in one dropdown and clicking the search button, all other dropdowns become inoperative…i don’t seem to be able to filter on multiple parameters, or to choose new options for further searches…can you give me an idea of what i’m doing wrong?

@djmercutio_2000

We have been experiencing problems with using more than two filters on a dataset lately, so this would probably be the first place start. Rather use query instead of filter as per this article, it is a bit more robust:

It should look something like this:


wixData.query("yourDatabaseNameHere") 
.contains("instruments", $w('#sInstrument').value) .contains("classification", $w('#dropdown1').value) 
.contains("city", $w('#dropdown2').value) 
.contains("state", $w('#dropdown3').value) 
.contains("school", $w('#dropdown4').value)
.find() 
.then( (results) => { 
 $w('#table1').rows = results.items;    
})      
 $w('#table1').show();
} )

Let me know if this solves it!

Tiaan

i’m getting an error: The element selector function (usually $w) cannot be used before the page is ready.

I’m assuming I need to define it, but how so? And can I still use my search button (i.e. ‘button1’ in my earlier code) here?

@djmercutio_2000

You should run the code inside the curly brackets when an event happens, for instance when a button is clicked or a dropdown is changed

something along the lines of this?

import wixData from ‘wix-data’;

export function button1_click(event, $w) {
$w(‘#dataset1’)

wixData.query(“Student_Records”)

.contains(“instruments”, $w(‘#sInstrument’).value)
.contains(“classification”, $w(‘#dropdown1’).value)
.contains(“city”, $w(‘#dropdown2’).value)
.contains(“state”, $w(‘#dropdown3’).value)
.contains(“school”, $w(‘#dropdown4’).value)
.find()
.then( (results) => {
$w(‘#table1’).rows = results.items;
})
$w(‘#table1’).show();
}

That should work, just remove “$w(’ #dataset1 ')” from the code

the code runs again, which is awesome, but it’s still not filtering…any thoughts as to why? and if it’d be easier, i can give you access to the site so you can see all of the pertinent moving parts; there may be an important piece i’m unaware i should be telling you…