How can let form submit the value of input inside shadow root of custom HTML element?

Viewed 187

I created a custom HTML input element like follow:

<html>
<script>
    class TestInput extends HTMLElement {
      constructor() {
        super();
        var shadow = this.attachShadow({mode:'open'});
        var cinput = document.createElement('input');
        cinput.setAttribute('type', 'text');
        cinput.setAttribute('name', 'test');
        cinput.setAttribute('value', 'test');
        shadow.append(cinput);
        this.cinput = cinput;

        }
    }
customElements.define('test-input', TestInput);
</script>
<body>
<form action="/test">
  <test-input></test-input>
  <input type="submit"></input>
</form>
</body>
</html>

However, when I used spring to receive the form parameters, I get nothing. How can I submit the form with the value of input inside the shadow root?

0 Answers
Related