Question

我使用jquery选择的插件进行Multi Select。我的选择看起来像这样：

<select data-placeholder="chose a friend" class="chosen-select" multiple>

    <?php   

        foreach ($my_friends as $key => $value) {

            echo '<option class="friend_firstname">'.$value["name"].'</option>';        

        }

    ?>  

</select>

完美无缺，插件返回：

<ul class="chosen-choices">
    <li class="search-choice">
        <span>John</span>
        <a class="search-choice-close" data-option-array-index="1"></a>
    </li>
</ul>

我的问题是我想添加显示无的附加信息，如下所示：

<ul class="chosen-choices">
    <li class="search-choice">
        <span>John</span>
        <span style="display:none" id="user_id">678</span>
        <a class="search-choice-close" data-option-array-index="1"></a>
    </li>
</ul>

在这里，我迷失了。如何在display none中添加其他信息？

感谢您的帮助

Answer 1

如果它只是表单提交，则应该为要提交的值提供name属性。同时为像

这样的选项元素添加值

<select name="friend" data-placeholder="chose a friend" class="chosen-select" multiple>
  <?php   
    foreach ($my_friends as $key => $value) {
      echo '<option class="friend_firstname" value="'.$value["id"].'">'.$value["name"].'</option>';        
    }
  ?>  
</select>

如果表单已提交，则数据将以数组的形式提交（如果从所选内容中选择了多个项目）。

这是一个示例

$(".chzn-select").chosen();
$('form').on('submit', function(e) {
  e.preventDefault();
  alert($(this).serialize());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.min.js"></script>
<form method="POST" action="/echo/json">
  <select data-placeholder="Choose a friend..." class="chzn-select" multiple style="width:350px;" name="friend">
    <option value="id1">Friend1</option>
    <option value="id2">Friend2</option>
    <option value="id3">Friend3</option>
  </select>
  <input type="submit" value="submit" name="submit" />
</form>

jquery选择的插件 - 添加显示无字段

1 个答案: