Below is a screenshot of the page as displayed to the user.
The first table, EVENTS, is directly connected to a dataset (no code). Once an EVENTS record is selected, all of its referenced records are displayed in the second table, EVENT_DETAIL. When the user selects a row from EVENT_DETAIL, it populates the text box below in the third box, below the text that says “You’ve selected”.
From there, I would like to collect ‘title’ from the EVENT_DETAIL as well as the data the user input (Name, Email, Phone, etc…) and insert into a third table, VOLUNTEERS. This is where I am lost.
You will see in the code below, it does not recognize the values from the EventDetail function. I have tried all I know to correct the syntax, to no avail. Any assistance would be greatly appreciated! Thanks in advance.
// For full API documentation, including code examples, visit http://wix.to/94BuAAs
import wixData from 'wix-data';
$w.onReady(function () {
//Setup the PFA_EVENT collection
$w("#tblEvent").columns = [
{
"id": "col1",
"dataPath": "title",
"label": "EVENT NAME",
"visible": true,
"type": "string"
},
{
"id": "col2",
"dataPath": "desc",
"label": "DESCRIPTION",
"visible": true,
"type": "string"
},
{
"id": "col3",
"dataPath": "display_date",
"label": "EVENT DATE",
"visible": true,
"type": "string"
},
{
"id": "col4",
"dataPath": "major_fundraising",
"label": "MAJOR_FUNDRAISING",
"visible": true,
"type": "string"
}
];
// select data from pfa_events
wixData.query("PFA_EVENTS")
.find()
.then((results) => {
// get the query result items
let tableRows = results.items;
// set the table row data
$w("#tblEvent").rows = tableRows;
//console.log(tableRows)
});
//Setup the PFA_EVENT_DETAIL table
$w("#tblEventDetail").columns = [
{
"id": "col1",
"dataPath": "title",
"label": "POSITION",
"width": 100,
"visible": true,
"type": "string"
},
{
"id": "col2",
"dataPath": "ped_desc",
"label": "DESCRIPTION",
"width": 100,
"visible": true,
"type": "string"
},
{
"id": "col3",
"dataPath": "display_date",
"label": "DATE/TIME",
"width": 100,
"visible": true,
"type": "string"
},
{
"id": "col4",
"dataPath": "available",
"label": "AVAILABLE",
"width": 100,
"visible": true,
"type": "string"
}
];
}); //close onReady ????
// Only display the EVENT_DETAIL rows from the Event row selected and none until row selected.
export function tblEvent_rowSelect(e) {
//Add your code for this event here:
var selectedRow = $w("#tblEvent").rows[e.rowIndex]
wixData.query("PFA_EVENT_DETAIL")
.gt("available", 0)
.contains("pfa_event", selectedRow._id)
.find()
.then((results) => {
// get the query result items
let tableRows = results.items;
var detailIds = results.items.map( det => det._id)
var detailTitle = results.items.map( det => det.title)
// set the table row data
$w("#tblEventDetail").rows = tableRows;
$w("#tblEventDetail").show();
// set the displayed selection to null if switching events
$w("#txtSelectedPosition").value = null;
console.log(tableRows)
console.log(detailIds)
console.log(detailTitle)
});
console.log(selectedRow)
} //close function tblEvent_rowSelect
// now get the value selected from EVENT_DETAIL to pass to text box and write to volunteers
export function tblEventDetail_rowSelect(event) {
//Add your code for this event here:
var selectedEdRow = $w("#tblEventDetail").rows[event.rowIndex]
wixData.query("PFA_EVENT_DETAIL")
//.contains("pfa_event", selectedRow._id)
.find()
.then((results) => {
// get the query result items
let tableRows = results.items;
//let tableIndx = results.items(0);
//var EddetailIds = results.items.map( det => det._id)
console.log('SELECTEDrOW'||selectedEdRow._id)
console.log('selectedEdRow'||selectedEdRow.title)
});
// display selected event detail title in text box
$w("#txtSelectedPosition").value = selectedEdRow.title;
} // close function tblEventDetail_rowSelect
export function submit_click(submitEvent) {
if (!$w('#txtFirstName').valid ||
!$w('#txtLastName').valid ||
!$w('#txtEmail').valid ||
!$w('#nbrVolQuantity').valid ||
!$w('#txtPhone').valid) {
$w('#txtError').text = "One or more fields are not valid";
$w('#txtError').show();
return;
} //close function submit_click
var data = {
"first_name": $w('#txtFirstName').value,
'last_name': $w('#txtLastName').value,
//'email': $w('#txtEmail').value,
'title': $w('#txtEmail').value,
'phone': $w('#txtPhone').value,
'quantity':$w('#nbrVolQuantity').value,
'comments':$w('#txtComments').value,
//'ped_title': $w('#dsEventDetail').getCurrentItem()._id,
'ped_title': $w("#txtSelectedPosition").value = selectedEdRow._id,
}; //THIS IS NOT RECOGNIZED HERE
wixData.insert('PFA_VOLUNTEERS', data).
then((e) => {
console.log(e);
$w("#txtSelectedPosition").value = selectedEdRow._id. //THIS IS NOT RECOGNIZED HERE
then((results) => {
//results.fulfilled = results.fulfilled + 1;
results.fulfilled = results.fulfilled + parseInt($w('#nbrVolQuantity').value,10)
wixData.update('PFA_EVENT_DETAIL', results).
then(() => {
$w('#dsEventDetail').refresh();
});
});
$w('#txtError').hide();
$w('#txtSuccess').show();
$w("#txtFirstName").value = null;
$w("#txtLastName").value = null;
$w('#txtEmail').value = null;
$w('#txtPhone').value = null;
$w('#nbrVolQuantity').value = null;
$w('#txtComments').value = null;
}).
catch((e) => {
console.log(e);
$w('#txtError').text = e;
$w('#txtError').show();
})
}