标签: multi-select

我正在尝试模仿 Windows 资源管理器处理多项选择的方式。在默认的 DataGridView 中，您可以使用 Ctrl 键单击来选择多个项目。但是，如果您释放 Ctrl 键，然后尝试拖放所选项目，则会清除所选项目并仅选择“命中”行。我在网上某处找到了以下解决方案。

protected override OnMouseDown(MouseEventArgs e)
{
  int hitRowIndex = HitTest(e.X, e.Y).RowIndex;
  if(!SelectedRows.Contains(Rows[hitRowIndex]))
  {
    base.OnMouseDown();
  }
}

然而，这会导致其他副作用。按住 CTRL 键并将鼠标放在所选项目上，该项目将保持选中状态。这是有道理的，因为如果选择了单击的行，则将绕过 mousedown 事件。从 Windows 资源管理器的行为来看，按住 CTRL 键取消选择项目似乎直到 MouseUp 事件才得到处理。有人尝试这样做吗？

任何人都知道如何通过 Sugar 的 REST API v4 从表单中的多选输入中插入多个值。我还没有找到任何关于此的文档。以下正确插入 1 个值，但我坚持保存多个值：

function getSugar($method, $parameters){
    $url = 'https://****.sugarondemand.com/service/v4/rest.php';
    $curl = curl_init($url);
    curl_setopt($curl, CURLOPT_POST, true);
    curl_setopt($curl, CURLOPT_HEADER, false);
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
    $json = json_encode($parameters);
    $postArgs = array(
         'method' => $method,
         'input_type' => 'JSON',
         'response_type' => 'JSON',
         'rest_data' => $json
          );
    curl_setopt($curl, CURLOPT_POSTFIELDS, $postArgs);
    $response = curl_exec($curl);
    if (!$response) {
         die("Connection Failure.\n");
     }
     $result = json_decode($response);
     if ( !is_object($result) ) {
         die("Error handling result.\n");
     }
     if($method == "set_entry" || $method == "login"){
         if ( !isset($result->id) …

以下是一些示例:

(来自谷歌加) (来自stackoverflow)

如何使用jQuery实现多选输入？(以上任何一种都可以).有没有jQuery插件？

我使用了Kendo UI中的multiselect.当用户从多选中删除项目时,我想知道是否有任何方法可以触发函数.到目前为止,我知道"更改"事件已被触发,但它过于通用,我无法找到有关用户删除内容的任何信息.还是有吗？

我是ASP.NET mvc和kendo ui框架的新手,有以下问题:

我在一个带有多选的窗口中有一个部分视图,它从数据库中接收它的值.视图看起来像:

@model SoftwareAdminInterface.Models.Administration.Pattern
<div id="myContentPopupEditRole_div">

@using (Ajax.BeginForm("SetCombi", "Pattern", new {  }, new AjaxOptions() { HttpMethod = "post", UpdateTargetId = "myContentPopupEditRole_div" }))
{
    <center>
        <br />
    <table class="table_no_borders">
        <tr>
            <td style="width: 300px">
                @(
                Html.Kendo().MultiSelectFor(model => model.RegExId)
                    .MaxSelectedItems(2)
                    .Name("RegExID")
                    .DataTextField("RegExName")
                    .DataValueField("RegExID")
                    .Placeholder("Select Patterns...")   
                    .AutoBind(false)       
                    .DataSource(source => {
                        source.Read(read =>
                        {
                            read.Action("GetPatternsForCombi", "Pattern");
                        })
                    .ServerFiltering(true);
          })
    )
            </td>
        </tr>
    </table>
        <button class="k-button k-button-icontext k-grid-custom" id="get" type="submit">@Resources.General.BtnSave</button>
    </center>
}   
</div>

我正在使用一个看起来像这样的模型:

public class Pattern
{
    [ScaffoldColumn(false)]
    public int RegExID { get; …

我正在使用bootstrap-multiselect并且需要提交带有选定选项的表单。

但是在表单提交时，url 会变成这样，....&sites=1&sites=2&sites=3而我需要它...&sites=1,2,3

这是我的代码：

<select id="sites" name="sites" class="form-control" multiple="multiple">
    <option value="1">Site 1</option>
    <option value="2">Site 2</option>
    <option value="3">Site 3</option>
</select>

JS：

$('button[type=submit]').click(function () {

      var text = $('#sites').val()
      //I have the list in `text` as 1,2,3 which need to in url
      //do the rest and continue submit

如何在 url 中发布这些选定的值（即url/sites=1,2,3代替url/sites=1&sites=2&sites=3）

谢谢你的帮助！

我找到了一个可以“全选”的例子：https : //ng-select.github.io/ng-select#/multiselect-checkbox

但是，我收到一个错误：Cannot read property 'selected' of undefined. 我想知道为什么我会收到这个错误，以及如何在 Angular 5 中使用 ng-select 实现“全选”。

谢谢

设想 ：

• 我有一个多选的角度材料过滤器

去做 ：

• 我想在隐藏下拉列表时获取选定的值..

  我用谷歌搜索并试图找到文档，但找不到任何将隐藏事件添加到 miltiselect 的参考

多选组件的数据属性不会在更改时更新。复选框不会在前端更新。

预期行为：单击复选框时应勾选。

代码链接：https : //jsfiddle.net/bzqd19nt/3/

<div id="app">
  <multiselect 
    select-Label=""
    selected-Label=""
    deselect-Label=""
    v-model="value" 
    :options="options"
    :multiple="true"
    track-by="library"
    :custom-label="customLabel"
    :close-on-select="false"
    @select=onSelect($event)
    @remove=onRemove($event)
    >
    <span class="checkbox-label" slot="option" slot-scope="scope" @click.self="select(scope.option)">
    {{ scope.option.library }}
      <input class="test" type="checkbox" v-model="scope.option.checked" @focus.prevent/>

    </span>
  </multiselect>
  <pre>{{ value }}</pre>
</div>

new Vue({
  components: {
    Multiselect: window.VueMultiselect.default
  },
  data: {
    value: [],
    options: [
      { language: 'JavaScript', library: 'Vue.js', checked: false },
      { language: 'JavaScript', library: 'Vue-Multiselect', checked: false },
      { language: 'JavaScript', library: 'Vuelidate', checked: false }
    ]
  },
  methods: …

所以我想<Chip />在<TextField />in之外显示选定的值<Autocomplete />。我能够将值显示为state. 不过，我还是无法删除那些芯片，即不只是显示器，而且还改变了selected控制的属性<Autocomplete />。有没有人有想法？

  const [val, setVal] = useState([]);

  const valHtml = val.map((option, index) => (
    <Chip
      label={option.title}
      deleteIcon={<RemoveIcon />}
      onDelete={() => {}}
    />
  ));

  return (
    <div>
      <Autocomplete
        multiple
        filterSelectedOptions
        options={top100Films}
        onChange={(e, newValue) => setVal(newValue)}
        getOptionLabel={option => option.title}
        renderTags={() => {}}
        renderInput={params => (
          <TextField
            {...params}
            variant="standard"
            placeholder="Favorites"
            margin="normal"
            fullWidth
          />
        )}
      />
      <div className="selectedTags">{valHtml}</div>
    </div>
  );
}

完整代码在这里