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

data-kontent-add-button only functions if content item id and element codename are on the same HTML tag #101

Open
jrkd opened this issue Mar 24, 2022 · 0 comments

Comments

@jrkd
Copy link

jrkd commented Mar 24, 2022

Brief bug description

What went wrong?
After adding a data-kontent-add-button & data-kontent-element-codename attributes to a div, the + button appeared next to a related items field in the preview, but clicking it greyed it out and gave a JS exception in the console:
image

The console suggests theres no language, project, content item or element codename set, however all are set in parent html elements.

Repro steps

  1. Create a content item with a related items field.
  2. Set the codename to "related_pages"
  3. Create a content item, and add some pages to the related pages field from 2.
  4. Note the content item id
  5. Setup a page with this sample html:
<body data-kontent-language-codename="en-GB" data-kontent-project-id="YOUR PROJECT ID">

    <div class="page-container" data-kontent-item-id="<The content item id from 4. that has the related_pages field>">

          <div class="related-pages" data-kontent-element-codename="related_pages" data-kontent-add-button>
               <h1>Example related page list item 1</h1>
               <h1>Example related page list item 2</h1>
           </div>

      </div>

</body>
  1. View this page on the web spotlight preview area (might require setting up the content item as a subpage of homepage)
  2. Click the + button next to the example h1s
  3. See the error in the console.

Note: This doesnt occur as soon as you add data-kontent-item-id="<The content item id from 4. that has the related_pages field>" to the .related-pages html element.

Expected behavior

Like the other data-kontent tags, Id expect the kontent-item-id to be inherited based on the hierarchy for use on the kontent-element's button, as per the readme:

'Although it is possible to put all previously specified data attributes on the same DOM node, you don't have to do it. We recommend you set data attributes hierarchically so that you don't have to duplicate the same attributes.'

Test environment

  • Platform/OS: .NET Core 5, Windows 11
  • Browser Chromium
  • Version 99
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant