Trying to submit iron-form polymer 2 - Cannot read property 'submit' of null

时间:2018-03-09 19:11:04

标签: polymer polymer-2.x iron-form

I'm not able to submit my iron-form. At this point I just need to see the content in the console, but when trying to submit the form i'm only getting error-msg: Uncaught TypeError: Cannot read property 'submit' of null. I've probably missed something obvious. I've been using the page: https://www.webcomponents.org/element/PolymerElements/iron-form

<iron-form id="sizeForm">
        <form method="post" action="">
            <paper-dropdown-menu label="Choose type" on-iron-select="_typeSelected">
                <paper-listbox slot="dropdown-content">
                    <paper-item value="Sneakers">Sneakers</paper-item>
                    <paper-item value="Shoes">Shoes</paper-item>
                    <paper-item value="T-shirts">T-shirts</paper-item>
                    <paper-item value="Jeans">Jeans</paper-item>
                </paper-listbox>
            </paper-dropdown-menu>
            <add-sneakers hidden$="{{hideSneakers}}"></add-sneakers>
            <paper-button onclick="{{_submitForm}}">Accept</paper-button>
            <div class="output"></div>
        </form>
    </iron-form>

<script>
    _submitForm() {
    document.getElementById('sizeForm').submit();
    }
</script>

2 个答案:

答案 0 :(得分:0)

更改

<paper-button onclick="{{_submitForm}}">Accept</paper-button>

<paper-button on-tap="_submitForm">Accept</paper-button>

<button onclick="_submitForm()">Accept</button>

此外,iron-form docs似乎错了:document.getElementById('sizeForm').submit()适用于button但不适用paper-buttonthis.$.sizeForm.submit()与之合作。 (我将更多地探讨这个问题,并可以提交拉取请求。)

有关示例,请参阅this pen

答案 1 :(得分:0)

您需要根据javascript的内容将id属性赋予表单

<form id="form_name" method="post" action="">

并在javascript上对其进行更正,因为您在示例中使用的ID已经(已经)定义了。

document.getElementById('form_name').submit();

因此,最重要的是,您需要在表单添加 id ,并在js代码上对其进行更正。