Question

创建了这个非常简单的代码来复制我的问题。如果输入文本没有值（正确），则不会提交表单。但是如果未选择选择输入（错误），它将提交。我可能在这里错过了一些非常基本的东西，但是我不知道是什么。

编辑：刚刚意识到这在Firefox中有效；但不是Chrome。

编辑2： Chrome正在使用以下内容而不是代码中的内容呈现我的页面。

<option value>Select</option>

任何想法为何？如果重要的话，这是一个.razor页面。但是根据其他研究，没有value =“”就是为什么它不能在Chrome中使用。

     <form>
        <div>
            Any Text: 
            <input type="text" required="required" />
        </div>
        <div>
            Country: 
            <select required="required">
                <option value="">Select</option>
                <option value="US">United States</option>
                <option value="CA">Canada</option>
            </select>
        </div>
        <div>
            <button type="submit">
                Test
            </button>
        </div>
    </form>

编辑3：我可以通过以下解决方法在HTML中正确显示HTML，但在Chrome中进行验证仍然无效：

  <form>
        <div>
            Any Text:
            <input type="text" required="required" />
        </div>
        <div>
            Country:
            <select required="required">
                <option value="@blankString">Select</option>
                <option value="US">United States</option>
                <option value="CA">Canada</option>
            </select>
        </div>
        <div>
            <button type="submit">
                Test
            </button>
        </div>
    </form>

@code {
    string blankString = "";
}

页面代码来源：

<select required="required">
                <option value="">Select</option>
                <option value="US">United States</option>
                <option value="CA">Canada</option>
            </select>

Answer 1

有同样的问题-最终使用js禁用/启用按钮，如下所示：

Disable button when no option is selected from dropdown

无法获取表格来验证所需的选择输入

1 个答案: