Vaadin Crud Adding ID to Items After Save


I am having a go at using vaadin-crud inside components and just loading items in throught the items property and using the save and delete callbacks to execute actions against the db.

What I’m not sure how to do is when a new item is created to put the id back on the object being edited. The object with ID is returned from the back-end, so I have that information inside the save listener, but it seems I cannot access the current element being edited.

For example if I assign a CRUD like:

firstUpdated() {
	this.crud = this.renderRoot.querySelector('vaadin-crud')

Inside my listener:

	//Do the save to the database, returns the object with ID populated.

	console.log(this.crud.editedItem) //Returns undefined, even if I preventDefault() and keep the dialog open.

I can access the edited item through the event (this is how I am doing the save). But if I edit this object it does not push back into the items set (the original data without the id persists).

Is there a way to do this without having to look up the items list and somehow find the new record and set the id?
Setting the ID is important so that subsequent saves / updates do not create new records.

This seems like it should be doable but I can’t figure out how from reading the API alone.


OK, small update.

It seems that editedItem is set when you edit an existing item, but not if you create a new item.

Manually setting editedItem in the new listener doesn’t seem to work, but if you manually load the item from the event object into the editedItem it seems to update the items list appropriately.

Still a couple of bugs to work out, but the main idea is working now.