Relation widget bug when using slug as valueField
- Dominant language
- JavaScript
- Stars
- 19.4k
- Forks
- 3.1k
- Avg merge
- 1d 14h
- Merged PRs (30d)
- 9
Description
**Describe the bug**
Relation widget is not working when using `{{slug}}` as `value_field` as described here https://www.netlifycms.org/docs/widgets/relation/. The autocomplete field only show one suggestion, and when selecting that option no value is assigned to the field. It works perfectly when using `title` as `value_field`. The only problem then is that the relation disappears when the title of the related item changes.
**To Reproduce**
1. Add relation widget
```
label: Top Activeties
name: top_activeties
widget: relation
collection:
search_fields: ["title"]
value_field: '{{slug}}'
display_fields: ["title"]
```
**Expected behavior**
Relation field should show all suggestions. When an item is selected the title should display, and the slug should be the value in the markdown file
**Screenshots**
Only one suggestion when using slug as valueField
When the item is selected the field is not updated with any value, preventing me from saving the page.
This is what it should look like, but now i use `title` as `value_field`

**CMS configuration**
```yml
---
backend:
branch: master
name: git-gateway
collections:
-
create: false
delete: false
folder: "_cms_EN_frontpage"
label: "EN: Frontpage"
name: frontpage
slug: "{{slug}}"
identifier_field: "frontpage"
editor:
preview: false
fields:
-
default: index
label: Layout
name: layout
widget: hidden
-
label: Language
name: lang
default: "en"
widget: hidden
-
default: Frontpage
label: Frontpage
name: frontpage
widget: hidden
-
label: SEO (search optimalization shorttext)
name: description
widget: string
-
label: Title 1
name: title_1
widget: string
-
label: Tekstboks 1
name: textbox_1
widget: text
-
label: "Top 3 activeties"
name: "top_3_activeties"
widget: "list"
summary: '{{fields.title}}'
allow_add: true
max: 3
min: 3
field: {label: Activity,name: top_activeties,widget: relation,collection: en_activity,search_fields: ["title"],value_field: '{{slug}}',display_fields: ["title"]}
-
label: Title 2
name: title_2
widget: string
-
label: Tekstboks 2
name: textbox_2
widget: text
-
label: Title 3
name: title_3
widget: string
-
label: Tekstboks 3
name: textbox_3
widget: text
-
label: "Gallery"
name: "galleryImages"
widget: "list"
summary: '{{fields.image}}'
field: {label: Image, name: image, widget: image}
-
create: false
delete: false
folder: _cms_EN_faq
label: "EN: FAQ"
name: en_faq
slug: "{{slug}}"
identifier_field: faq
editor:
preview: false
fields:
-
default: FAQ
label: FAQ
name: faq
widget: hidden
-
label: Language
name: lang
default: "en"
widget: hidden
-
default: faq
label: Layout
name: layout
widget: hidden
-
label: SEO (search optimalization shorttext)
name: description
widget: string
-
label: Title
name: title
widget: string
-
label: "FAQ"
name: "faq_list"
minimize_collapsed: true
widget: "list"
fields:
- {label: Title, name: faq_title, widget: string}
- {label: Content, name: faq_content, widget: markdown }
-
create: false
delete: false
folder: _cms_EN_about
label: "EN: About"
name: en_about
slug: "{{slug}}"
identity_field: about
editor:
preview: false
fields:
-
default: about
label: About
name: about
widget: hidden
-
label: Language
name: lang
default: "en"
widget: hidden
-
default: about
label: Layout
name: layout
widget: hidden
-
label: SEO (search optimalization shorttext)
name: description
widget: string
-
label: Title
name: title
widget: string
-
label: Body
name: body
widget: markdown
-
create: true
folder: _cms_EN_activity
label: "EN: Activity"
name: en_activity
editor:
preview: false
slug: "{{slug}}"
fields:
-
label: Language
name: lang
default: "en"
widget: hidden
-
default: activity
label: Layout
name: layout
widget: hidden
-
label: SEO (search optimalization shorttext)
name: description
widget: string
-
label: Title
name: title
widget: string
-
label: "Gallery"
name: "galleryImages"
widget: "list"
summary: '{{fields.image}}'
field: {label: Image, name: image, widget: image}
-
label: Body
name: body
widget: markdown
-
label: Price
name: price
widget: string
required: false
-
label: Time
name: time
widget: string
required: false
-
label: Peoples
name: people
widget: string
required: false
-
label: "Practical information"
name: practical
widget: markdown
required: false
media_folder: static/images/uploads
```
**Additional context**
netlify-cms-app 2.14.21
bootstrap.js:85 netlify-cms-core 2.38.0
index.js:27 netlify-cms 2.10.91
Contributor guide
Assessment
This issue has not been assessed yet.