Question

我想知道我是否可以得到一些帮助。我有一个表单，我想将数据提交到数据库。但是，我在使用以下代码时遇到了问题。选择输入设置为禁用，因此如果未选择任何内容，则表单不会提交这些字段（默认情况下字段仍然是空白。

<div class="form-group">
        <label for="title">
                Title
                    <span class="asteriskField">
                          *
                     </span>
        </label>
        <select id="inputtitle" name="title" class="form-control" onchange="updateReview('title');" tabindex=1 />
                    <option value="" selected disabled>Please select</option>
                    <option value="Master">Master</option>
                    <option value="Mr">Mr</option>
                    <option value="Mrs">Mrs</option>
                    <option value="Miss">Miss</option>
                    <option value="Ms">Ms</option>
                    <option value="Rev.">Rev.</option>
        </select>
</div>

谢谢。

Answer 1

在selectbox中使用disabled on选项不是一个好的解决方案，因为它不会强制用户选择选项。如果他没有点击选择框，则会发布空白值。

要强制用户在选择框上选择选项使用required，并且还禁用默认选项，因此他必须选择一个选项。

Answer 2

使用表单OnSubmit事件，并在javascript中手动创建formdata，并根据条件将字段发送到服务器。

Answer 3

这就是表单在HTML中的工作方式。提交表单时，将检索所有输入字段并将其发送到指定的操作。但是，未选中的选择框不属于帖子。

如果要发送所有选择框（包括未选中的框）的列表，常见的技巧是为每个选择框创建一个具有相同值的隐藏输入。这样，您将获得所有选定字段的列表，以及可选字段的完整列表。

Answer 4

这是一个错误的行为，你应该在任何查询到DB之前验证是否使用javascript或某些后端代码选择它。不要在你想要的字段中使用disabled，在某种程度上，检索某种数据，因为你正在改变元素的内在行为，混淆下一个将使用你的代码的人。

如果未选择任何内容，您可以使用某些错误消息将false返回到后端，或者只是使用javascript禁用提交按钮的可视化。

编辑：@Autista_z的解决方案很好

要强制用户选择selectbox所需的选项，并禁用默认选项，因此他必须选择一个选项。

我只想表达同情：不要在没有验证的情况下让后端，双重验证（前/后）是必须。

提交带有禁用输入的表单

4 个答案: