7

我的问题是当我在任何一个选择框中选择一个选项,然后在另一个选择框中选择另一个选项时,值会自动更改。我该如何解决这个问题。我想根据我的选择过滤值并将其显示在表格中而不使用插件。

Here is my code:

http://jsfiddle.net/pW6P6/4/

4

3 回答 3

2

我将您的排序功能合并为一个功能。

即,fxnSelectYear、fxnSelectMake、fxnSelectModel、fxnSelectSubModel 到fxnUpdateGrid

如果您可以将您的 fxnReLoading.. 功能合并为一个,那就更好了。

演示

希望这可以帮助。随时问我问题。

于 2012-12-12T10:33:09.223 回答
1

如果你想保存你的逻辑。您可以在删除每个选项之前保存选定的值,并在重新初始化您的选择值后选择它:

http://jsfiddle.net/pW6P6/9/

var selected = $('#DropDown_Year option:selected').val();
$('#DropDown_Year option[value]').remove();
iHtmlYear = fxnOptions(g_YearsArray);
$('#DropDown_Year').append(iHtmlYear);
$("#DropDown_Year option[value=" + selected + "]").attr("selected", true);
于 2012-12-12T10:06:30.890 回答
1

哇,这么小任务的代码太多了……

无论如何,在您的每个“更改功能”中,您都在重新加载其他过滤器选择。这就是为什么选择框被重置

例如:

fxnSelectMake = function () {
    $('#tableID tr').remove();
    g_newRows = "";
    $.each(g_Vehicle, function (index) {
        if (g_Vehicle[index].Make == $('#DropDown_Make').val()) {
            fxnCreateRow(g_Vehicle, index);
        }
    });
    $('#tableID').append(g_newRows);
    fxnReLoadingModelFilters();         // <-- this is what i mean
    fxnReLoadingSubModelFilters();      // <-- and this
    fxnReLoadingYearFilters();          // <-- and this

},

但这只是第一部分。你的主要问题是这段代码:

$.each(g_Vehicle, function (index) {
  if (g_Vehicle[index].Make == $('#DropDown_Make').val()) {
    fxnCreateRow(g_Vehicle, index);
  }
});

您的 g_Vehicle-Object 仍然是 TOTAL 对象,您只是在检查当前选择的值(不是年份等)

我编写了一个函数“isInIndex”,它检查所有 4 个当前选定值,并且仅在当前车辆行对所有 4 个选择框都有效时才返回 true:

isInIndex = function(vehicle) {
  return ($("#DropDown_Year").prop("selectedIndex") === 0 || vehicle.Year === $('#DropDown_Year').val()) &&
      ($("#DropDown_Make").prop("selectedIndex") === 0 || vehicle.Make === $('#DropDown_Make').val()) &&
      ($("#DropDown_Model").prop("selectedIndex") === 0 || vehicle.Model === $('#DropDown_Model').val()) &&
      ($("#DropDown_SubModel").prop("selectedIndex") === 0 || vehicle.SubModel === $('#DropDown_SubModel').val())
}

然后我在您的每个“更改功能”中调用此功能:

$.each(g_Vehicle, function (index) {
  if (isInIndex(g_Vehicle[index])) {
    fxnCreateRow(g_Vehicle, index);
  }
});

更新和工作小提琴在这里:http: //jsfiddle.net/pW6P6/10/

编辑:您的代码中可能有很多优化可能性,其中之一是您应该将 jQuery-Objects 保存到变量中,并使用它们:

例如:

var $dropDownMake = $('#DropDown_Make');

// and later
$dropDownMake.val()
于 2012-12-12T10:20:39.317 回答