实施例

Question

我有一个仪表板，其中包含数据库中的数据。

首先，我选择了像

这样的过滤器

“从Y中选择X，其中fieldX =（选择的密钥在这里）”

然后仪表板中的数据发生变化。

目前，我正在使用onchange属性。在激活选择之后，仪表板会在没有提交按钮的情况下更改。

但是现在，我想要添加更多选择（如4，就像表格一样）。问题是，在激活选择后，仪表板会发生变化。仅1个选择（预期效果）不是问题，但我想选择更多选择字段以在我的仪表板上添加更多过滤器，如

“从Y中选择X，其中fieldX =（来自selectX的键在这里）和fieldZ =（来自selectZ的键在这里）和[...] ”

（请注意，用户会选择过滤器。有些选择字段可能会被选中）

我的问题是否有办法，使用onchange（或不使用）来做到这一点。也许使用提交按钮或什么？

目前我正在使用这样的东西：

//PEGANDO O SELECT REGIONAL PARA O GRÁFICO 
$('select#SELECTID').on('change', function (e) {
  var SELECTID = this.value;
  //url 
  control('ocupantes-aptos/dashboard?SELECTID =' + SELECTID , 'content');
});

Answer 1

同样的事情。将事件绑定到所有涉及的SELECT。如果你有一个ID（＃选择器），你不需要指定SELECT。在回调中，您现在必须显式检索每个控件的值：

addComponent():void { 
    let component =  $compile('<component-selector></component-selector>')(scope)
    ele.append(component)
}

或者您可以为所有控件提供特定的类：

$('#selectId1, #selectId2, #selectId3').on('change', function () {
  var s1 = $('#selectId1').val();
  var s2 = $('#selectId2').val();
  var s3 = $('#selectId3').val();
  //url 
  control('ocupantes-aptos/dashboard?SELECTID =' + s1 , 'content');
});

与

$('select.grupo1').on('change', ...

注意：jQuery还具有有效序列化表单或控件集的功能，因此您无需指定所有<select id="selectId1" class="grupo1"> ...个。

实施例

在此示例中，我们发送所有＆＃39; grupo1＆＃39;任何值发生变化时的值。 HTML看起来像一系列元素：

val()

甚至更短，使用＆＃34;＃grupo2 select＆＃34;而不是＆＃34; select.grupo1＆＃34;：

<select name="s[1]" class="grupo1">...</select>
<select name="s[2]" class="grupo1">...</select>

jQuery（这使用＆＃34; select.grupo1＆＃34;作为选择器）

<div id="grupo2">
<select name="s[1]">...</select>
<select name="s[2]">...</select>

PHP将收到：

var sels = $('select.grupo1');
sels.on('change', function() {
    // We want to use the control() function, so
    // we need to build the URL. We may have problems with too many selects,
    // and in that case we will need to modify control().
    control('ocupantes-aptos/dashboard?' + sels.serialize(), 'content');
});

包含多个选择字段的{on}

1 个答案:

实施例