谷歌瀏覽器無法提交顯示的表單：無

除非我從template=row div中刪除style="display:none"，否則此表單上的提交按鈕不會執行任何操作。爲什麼？？谷歌瀏覽器無法提交顯示的表單：無

（各形式控制的name由JavaScript的動態填充，然而，爲了簡化故障排除，我跑的形式而不javascript和問題歸結到display標記是否是存在的）。

這就是鉻控制檯說：

bundleAn invalid form control with name='' is not focusable. 
bundleAn invalid form control with name='label' is not focusable. 
bundleAn invalid form control with name='unique' is not focusable

HTML：

<form method="POST" action="/add/bundle"> 
    <p> 
     <input type="text" name="singular" placeholder="Singular Name" required> 
     <input type="text" name="plural" placeholder="Plural Name" required> 
    </p> 

    <h4>Asset Fields</h4> 

<div class="template-view" id="template_row" style="display:none"> 
    <input type="text" data-keyname="name" placeholder="Field Name"> 
    <input type="text" data-keyname="hint" placeholder="Hint"> 


    <select data-keyname="fieldtype" required> 
     <option value="">Field Type...</option> 
    </select> 

    <input type="checkbox" data-keyname="required" value="true"> Required 
    <input type="checkbox" data-keyname="search" value="true"> Searchable 
    <input type="checkbox" data-keyname="readonly" value="true"> ReadOnly 
    <input type="checkbox" data-keyname="autocomplete" value="true"> AutoComplete 
    <input type="radio" data-keyname="label" value="label" name="label" required> Label 
    <input type="radio" data-keyname="unique" value="unique" name="unique" required> Unique 
    <button class="add" type="button">+</button> 
    <button class="remove" type="button">-</button> 
</div> 

<div id="target_list"></div> 

    <p><input type="submit" name="form.submitted" value="Submit" autofocus></p> 

</form>

來源

2011-08-24 MFB

你是什麼意思的「不能提交」？ –

對不起，我剛纔編輯的問題做得更清晰 – MFB

的原因似乎是HTML 5 constraint validation - 這是require屬性。 Chrome已經開始支持這個版本。

顯然它看起來像這是一個backward compatibility issue，但您可以通過爲您的提交按鈕設置formnovalidate屬性來修復它。

我假定，這實際上是一個安全功能，防止通過提交假定用戶提交數據操縱時，隱藏的內容，在該方向上此引用點：

如果控制中的一個不被呈現（例如它具有隱藏屬性集），那麼用戶代理可能會報告腳本錯誤。

你輸入的text型的，所以他們的目的是讓用戶輸入數據時，提交自己的內容，而隱藏的東西，用戶可能不希望。

如果您仍然希望在使用客戶端驗證時提交隱藏的輸入，我會建議使用<input type="hidden">而不是 - 我可以想象，驗證時沒有錯誤，因爲它們旨在隱藏。

來源

2011-08-25 00:27:37 emboss

，能解決問題，謝謝。但是，現在我無法驗證客戶端，對嗎？沒有問題，如果是這樣的話，但我只是想確保我沒有遺漏一些仍然允許我驗證所需字段的東西。 – MFB

我編輯了這篇文章 - 我可以想象，'input type =「hidden」'仍然可以通過表單驗證。 – emboss

我做了一個的jsfiddle探討您的問題here，我設法通過增加解決它檢查你的單選按鈕輸入，像這樣：<input type="radio" data-keyname="label" value="label" name="label" required checked>。在上面的代碼中，單選按鈕未被選中，但由於它們被標記爲required，表單驗證失敗，Chrome拒絕提交表單。

來源

2011-08-25 00:28:15

感謝塞巴斯蒂安，這是一個很好的解決方法，但由於我排除的JavaScript實際上克隆了控件，我不是真的希望默認情況下檢查收音機，否則每次克隆控件時都會取消用戶的合法選擇。 – MFB

谷歌瀏覽器無法提交顯示的表單：無

回答

相關問題