Hi guys!
I’m creating a form where filmmakers enter their film credits. I’d like the filmmakers to have the ability to click on the “+ button” to add additional credits and “-“ to remove credits.
I have two collections:
→ “Credits” (list of credits for dropdown)
→ “Credit Names” (to save input of selected credit, full name, and Instagram handle)
I followed this example and tried to customize it to my needs, but m y input elements are disabled:
https://www.wix.com/corvid/forum/tips-tutorials-examples/example-input-repeaters
I also looked into these resources:
https://www.wix.com/corvid/forum/tips-tutorials-examples/example-todomvc
https://www.wix.com/corvid/reference/$w.Repeater.html
Is there something wrong with or missing in my code?
// For full API documentation, including code examples, visit http://wix.to/94BuAAs
import wixData from "wix-data";
let credits = [];
$w.onReady(async function () {
let resCredits = await wixData.query("Credits").find();
let resItems = resCredits.items;
credits = resItems.map((item) => { return { "label": item.title, "value": item.title } });
$w("#creditsRepeater").onItemReady(($item, itemData, index) => {
$item('#creditsDropdown').options = credits;
$item('#creditsDropdown').value = itemData.creditType;
$item("#addCreditsButton").onClick(async (event) => {
await $item('#creditNamesDataset').save();
});
});
})
export async function addCreditButton_click(event) {
await $w('#creditNamesDataset').new();
let item = $w("#creditNamesDataset").getCurrentItem();
$w("#creditsRepeater").forEachItem(($item, itemData, index) => {
if (item._id === itemData._id) {
console.log("new", item._id);
$item('#creditsDropdown').show();
$item('#ceditNameInput').show();
$item('#instagramInput').show();
}
});
}
async function addNewOnEmpty() {
if ($w("#creditNamesDataset").getTotalCount() === 0) {
await $w('#creditNamesDataset').new();
let item = $w("#creditNamesDataset").getCurrentItem();
$w("#creditsRepeater").forItems([item._id], ($item, itemData, index) => {
$item('#creditsDropdown').options = credits;
$item('#creditsDropdown').value = itemData.creditType;
$item('#creditsDropdown').show();
$item('#ceditNameInput').show();
$item('#instagramInput').show();
});
}
}
My page: https://www.bayareafilmmakers-arthouse.com/film-metadata
