禁用基于JSON数据的选择选项

时间:2016-09-08 15:57:16

标签: javascript jquery json

我使用Jiren filter library来过滤JSON数据。 因此,当我使用某些过滤条件时,我想在select中禁用未使用的选项。

例如:在我的结果中,我没有任何游轮类型" Silversea Expedition"我想在我的过滤器中禁用此选项。

这是我的代码:

HTML:

<div class="well">
              <fieldset id="cruiseType_criteria">
                  <legend>Cruise Type</legend>
                  <select class="form-control" id="type_filter" role="listbox">
                      <option value="all">All</option>
                      <option value="Silversea Classic">Cruise</option>
                      <option value="Silversea Expedition">Expedition</option>
                  </select>
              </fieldset>
          </div>

JSON对象:

{
    "id": 23,
    "Destination": "Mediterranean",
    "DestinationID": "263960e8-9eaa-4ab0-a040-25bdf94479ee",
    "DepartureDate": "2016-02-09T04:45:01 -01:00",
    "Ship": "Explorer",
    "ShipID": "8b7571a9-1a73-40c3-916f-27b3981167d1",
    "CruiseType": "Silversea Classic",
    "Duration": 13,
    "AllInclusive": true,
    "WaitList": false,
    "FareFrom": 5434,
    "Currency": "$",
    "Cities": [
      "ad",
      "magna",
      "dolore",
      "quis",
      "magna",
      "sint",
      "consequat",
      "nostrud",
      "amet",
      "fugiat",
      "proident",
      "aliqua"
    ],
    "VoyageCode": "{{integer(100, 9999)}",
    "Features": [
      {
        "id": 0,
        "name": "Diving"
      },
      {
        "id": 1,
        "name": "Wellness"
      }
    ],
    "url": "silversea.com"
  },

Screenshot

提前谢谢你,

1 个答案:

答案 0 :(得分:0)

考虑到您的json数据位于jsonObjCruiseType是一个数组。

var cruiseType= jsonObj.cruseType;
$("#type_filter").each(function()
        {
            // checking if option is present in cruiseType array or not
            if(jQuery.inArray($(this).val(), cruiseType) == -1){
                $(this).prop('disabled', true);
            }
        });

上述代码会将disbled=true添加到CruiseType jsonObj中不存在的选项中。