Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Manually update tag data after it was added #433

Closed
mzangari opened this issue Feb 27, 2020 · 4 comments
Closed

Manually update tag data after it was added #433

mzangari opened this issue Feb 27, 2020 · 4 comments

Comments

@mzangari
Copy link

mzangari commented Feb 27, 2020

Hi, and thanks for this beautiful library!
I'm encountering an issue which i hope someone can help me solve here:
I'm trying to programmatically update the tags data properties after the "add" event.
My current behaviour is this:

When a user enter a new tag, i make an ajax call to store the newly added tag in database.

The call response contain the new tag record along with full properties.
What i'm trying to achieve is to update the tagify object with these additional properties (like the "id" value, which i need to be able to use in the remove event).

So far i was not able to do this.

I'm trying to use the replaceTag function passing the new data like this:
tagify.replaceTag(tagify.getTagElms()[e.detail.index],data.tag);
where data.tag is an object like this:

{
	id: "32"
	label: ""
	description: ""
	locked: "0"
	type: "device"
	value: "test"
	created_at: "2020-02-27 17:21:02"
	updated_at: "2020-02-27 17:21:02"
}

but this leads me to a notAllowed element.
Is there a way that i can accomplish this? What am i doing wrong?

I've built a very simple pen here that replicates this same behaviour:
https://codepen.io/mzed/pen/eYNWZPB

Thanks for any help!

@mzangari
Copy link
Author

mzangari commented Feb 28, 2020

After more digging:
i suspected this may have something to do with the fact that i dont allow duplicates: it seemed to me the new element was marked as notAllowed by the replaceTag method because it had the same "value" field. But then i've tried with a different "value" and it end up with the same notAllowed mark. So my issue still remains: how can i dynamically add properties to an already existing tag?
How "right" it is to tackle directly with the tagify.value and edit the properties directly there? I've tried something like this:
tagify.value[e.detail.index].id = data.tag.id
and the tagify.value array updates correctly. but if i later try to remove the newly added tag, the additional "id" property is not found anymore in the event detail.

@yairEO
Copy link
Owner

yairEO commented Feb 29, 2020

I understand your need and I have been contemplating on the best approach to allow developers to easily update a tag's properties after it has been created.

@yairEO
Copy link
Owner

yairEO commented Feb 29, 2020

Add __isValid: true property to your new data Object so it will force replaceTag method to skip re-validation.

@yairEO yairEO closed this as completed Feb 29, 2020
@yairEO yairEO changed the title Need some help with replaceTag/dynamic update Manually update tag data after it was added Feb 29, 2020
@mzangari
Copy link
Author

mzangari commented Mar 2, 2020

Thank you @yairEO , your suggestion worked like a charm!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants