Bootstrap Dropdown-在下拉按钮中显示选择并存储在数据库中


Bootstrap Dropdown - Display selection within dropdown button and store in database

我想实现两件事:

  1. 在下拉按钮中显示用户所做选择的文本
  2. 我希望能够将此选择保存到一个变量中,因为我希望在提交表单时将其存储在数据库中

代码:这是我试图让文本显示在按钮中的内容。

  <p>What group does the event belong to? </p>
    <div class="btn-group">
        <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Select a category
        <span class="caret"></span></button>
        <ul class="dropdown-menu" role="menu">
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
          <li><a href="#">5</a></li>
          <li><a href="#">6</a></li>
        </ul>
      </div>
    <br>

    <script>
    <!--This code is to get the button to display the selected field-->
    $('.caret').on('click', function(){
        $('.dropdown-menu li').val($(this).text());
    });

    </script>

有人能帮助实现其中一个或两个目标吗?提前谢谢。

如果我正确理解了你的问题,这个脚本应该可以随心所欲。

$(function() {
    var selectedOption;
    $('.dropdown-menu a').on('click', function(){
        selectedOption = $(this).text();
        $('button.btn').html(selectedOption);
    });    
})