How: Input form retaining item after save

So, Here is the the page: https://www.onetribeconference.com/registration
I am wanting parents to register their children for child care. The problem is once they put their personal information (parentFN, parentLN, parentPhone) I want them to add a child (childFN, childLN). When they click “Add a Child” button (addChild) I want that entry to be saved into the collection, once the page (automatically, as I can’t stop it, refreshes) the parent information is erased.

I need to have the Add Child button save the record (row) into the collection Child. Then the child fields return to the placeholder but the parent information remain visible. Then if the parent clicks finish, THEN… the page can refresh (or save normally triggering a refresh and all fields by default go bacl to their placeholder.

I tried to use this logic, but as soon as the save command gets executed, it refreshes the page. I also tried to save the parentFN and parent LN into a variable but it’s not available globally so that once the page refreshes, the input field can insert those variables. Please show me some examples as I’ve been trying for a couple of days. Thanks, Marti.

import wixData from “wix-data”;

// For full API documentation, including code examples, visit Velo API Reference - Wix.com

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

});

export function oneMore_onClick() {
if ($w(‘#parentFN’).value !== “”) {
let pFN = $w(‘#parentFN’).value;
let pLN = $w(‘#parentLN’).value;
$w(‘#childInfo’).save(oneMore_onClick());
console.log(“Child Saved”);
$w.onReady(function () {
$w(“#parentFN”).value = pFN;
$w(“#parentLN”).value = pLN;
});

} else { 
	console.log("Name Missing"); 
} 

}

export function finished_onCLick() {
$w(“#parentFN”).value = “First Name0022”; //test to see if it changes, yes but not as expected
$w(‘#parentLN’).placeholder = “Last Name00”;
$w(‘#childFN’).placeholder = “First Name00”;
$w(‘#childLN’).placeholder = “Last Name00”;
}

I am trying to understand what is the issue here.

What I can see from the code that the use of

$w.onReady(function () {
			$w("#parentFN").value = pFN;
			$w("#parentLN").value = pLN;
		});

is misplaced. $w.onReady is only used once - when the page is loaded.

The save command should not refresh the page…

I now see what is the problem - both the parent information and the child information is connected to the same dataset. The dataset, of type write-only, clears all connected elements on save. What do you expect to be saved in the collection when you click add a child? just the child information or both the child and parent information?

If you want to, post saving the child, to re-populate the parent information, you should use the .then member of the save result promise, something like

let pFN = $w('#parentFN').value;
let pLN = $w('#parentLN').value;
$w('#childInfo').save(oneMore_onClick())
  .then(function () {
	$w("#parentFN").value = pFN;
	$w("#parentLN").value = pLN;
  });

Thank you, I forgot to remove that in the on.Ready as I was trying multiple things. What I ultimately want is a dataset entry for each child (row) without the parent to have to enter their personal info (name, email, phone, etc) multiple times. I even tried doing a pulldown with “how many kids do you want to check in” but that only entered all three (i.e.) children into one row…

So I have a three day event, 4th 5th and 6th. I want to ask the parent 1) how many kids do you need child care for and for which day. Normally, I would do a dataset for the parent, nother one for the child and then link as needed. I don’t think we can use two datasets in one page (?) A child and a parent dataset? I’ll try your method above. Thanks.

  1. Try method I suggested. Let’s see if it works for you.

  2. You can use as many datasets on a page as you want. There is no limit.

Genius, it worked. If parent first name A and Last name B (AB) has child C1, C2 and C3 attend the first day (D1), and then C1 only attend the last day D2. I’m trying the best way to input a line in the dataset:
Row 1: A | B | C1 | D1 | | D3
Row 2: A | B | C2 | D1 | |
Row 3: A | B | C3 | D1 | |
Then I can pull a dynamic page list filtered by days to see how many children will attend each day. Is there a simpler way?

You can do the same using code - using a count query with the right filters.