时间戳

首页 > 解决方案 > 如何从引导程序 4 下拉列表中获取发布数据

express - 如何从引导程序 4 下拉列表中获取发布数据

问题描述

我有一个问题。在引导程序 4 中使用下拉菜单，使用带有锚点的按钮样式下拉菜单。下拉功能工作正常，但是当我实际提交表单时，我没有从下拉列表中获取值。除了我需要提供的名称之外，是否还有特殊属性或其他内容？我没有在 expressjs 中看到请求正文中的值。

<div class="form-group">
    <div class="col-5">
        <label for="sec_questions">
            Security Questions <span class="error_required">*</span>
        </label>
        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" 
              id="sec_questions" name="sec_questions" value="this" 
              role="dropdown" data-toggle="dropdown" 
              aria-haspopup="true" aria-expanded="false">
                Please Select
            </button>
            <div class="dropdown-menu" aria-labelledby="sec_questions">
                <a class="dropdown-item" href="#">
                    What is your mother's maiden name?
                </a>
                <a class="dropdown-item" href="#">
                    What is your pet's name?
                </a>
                <a class="dropdown-item" href="#">
                    What street did you grow up on?
                </a>
                <a class="dropdown-item" href="#">
                    Where did you go in elementary school?
                </a>
                <a class="dropdown-item" href="#">
                    Who was your first employer?
                </a>
            </div>
        </div>
    </div>
</div>

req 正文中存在所有其他字段，但下拉列表很奇怪。

标签： expressbootstrap-4

解决方案

bootstrap4下拉菜单用于样式。它不是 HTML 表单元素。除非您使用javascript抓取所有输入值并将它们作为一个整体提交AJAX，否则它不会自动绑定到您的表单。

要将所选数据绑定到您的表单提交，请<select />改用。

<div class="form-group">
    <select class="form-control" name="sec_questions">
        <option>Please Select</option>
        <option>What is your mother's maiden name?</option>
        <option>What is your pet's name?</option>
        <option>What street did you grow up on?</option>
        <option>Where did you go in elementary school?</option>
        <option>Who was your first employer?</option>
    </select>
</div>

演示：http: //jsfiddle.net/davidliang2008/aq9Laaew/290563/

不要忘记name表单元素上的属性！

推荐阅读