javascript - 从 jquery 中的选择框值过滤呈现的网格结果

Question

更新:我认为我的问题变得简单多了。我该怎么做才能告诉:

 var query = $(":input[name=filter]").val(),

将$("select[name=PR_Type]").val(),作为参数？ 我试过这样的事情:

var query = $(":input[name=filter]").val() || $("select[name=PR_Type]").val(),

但这只需要 $("select[name=PR_Type]").val(), 作为过滤结果...

---

我正在尝试根据从选择框中选择的值来过滤结果。 renderResult() 函数呈现一个网格，其中包含一些标签和呈现的数据，它看起来像这样:

renderResult: function () {
 var query = $(":input[name=filter]").val(),
 querySelect = $("select[name=PR_Type]").val(),
 queryRegexp = query === "" ? undefined : new RegExp(query, "i"), 
 console.time("productos.renderResult()");
     $("#result").html("");
         productos.sort();
     $.each(productos.models, function (i, row) {
     if (!row.transformed) {...

所以我想到了这样的事情:

$('[name=PR_Type]').on('change', function (event) {

        var selection = $(this).val(), //Changed here and now I get the value

        products.renderResult(selection);
    });

和这样的选择框:

<select name="PR_Type"></select>

此选择框从连接到 servlet 的 json 文件中获取其值。这就是我为选择框设置选项的方式:

 var types = [];
    for (var type in productos.productosTypes) types.push(productos.productosTypes[type] + "|" + type);
    $("[name=PR_Type]").setOptions(types);

我还创建了一个函数来获取值来执行如下操作:

this.getValue("PR_Type"), 

但我不确定如何实现它了

getValue: function (name) {
        var $elemSelect = $("select[name=" + name + "]");
        return $elemSelect.val() ? escape($elemSelect.val()) : "";
    },

我知道我在 $('[name=PR_Type]').on('change', function (event) { 上遗漏了一些东西，但我不确定它是什么。提前感谢大家的任何建议!

Answer 1

解决了!所有的问题都在 renderResult() 中，我试图查看选择框的值是空的还是 null，这是错误的。我应该看看它是否为 null ori undefined，然后我不得不稍微更改 regExp if scentence。所以最后我改变了这个:

querySelect = $("select[name=PR_Type]").val(),
queryRegexp = query === "" ? undefined : new RegExp(query, "i"), 

并添加了这个:

querySelectRegexp = querySelect === null ? undefined : new RegExp(querySelect, "i"),

现在看起来像这样:

renderResult: function () {
        var query = $(":input[name=filter]").val(),
            querySelect = $("select[name=PR_Type]").val(),
            queryRegexp = query === "" ? undefined : new RegExp(query, "i"), 
            querySelectRegexp = querySelect === null ? undefined : new RegExp(querySelect, "i"),

如果香味是这样的正则表达式:

  if (querySelectRegexp !== undefined) {

                    if (queryRegexp !== undefined) {
                        if (row.name.match(queryRegexp)) {
                            row.classes = row.classes.replace(/hide/g, "");
                        } else {
                            if (row.classes.indexOf("hide") === -1) {
                                row.classes += " hide";
                            }
                        }
                    } else if (querySelectRegexp !== undefined) { (row.type.match(querySelectRegexp)) {
                            row.classes = row.classes.replace(/hide/g, "");
                        } else {
                            if (row.classes.indexOf("hide") === -1) {
                                row.classes += " hide";
                            }
                        }
                    } else {
                        row.classes = row.classes.replace(/hide/g, "");
                    }

现在看起来像这样:

  if (querySelectRegexp !== undefined) {
                        if (row.type.match(querySelectRegexp)) {
                            row.classes = row.classes.replace(/hide/g, "");
                        } else {
                            if (row.classes.indexOf("hide") === -1) {
                                row.classes += " hide";
                            }
                        }
                    }
                    if (queryRegexp !== undefined) {
                        if (row.name.match(queryRegexp)) {
                            row.classes = row.classes.replace(/hide/g, "");
                        } else {
                            if (row.classes.indexOf("hide") === -1) {
                                row.classes += " hide";
                            }
                        }
                    } else {
                        row.classes = row.classes.replace(/hide/g, "");
                    }