jquery - 两个选择选项以获得结果和一个搜索按钮

Question

我在 jquery 中使用全日历来选择和搜索我希望每次单击按钮时都会出现模式的事件，因此当他们选择事件或指定城市时会出现结果。这是 HTML，这些是条件：

1. 用户搜索城市：结果将包括所有城市
2. 用户将搜索事件：结果将包括一个事件。
3. 用户将同时搜索城市和事件：结果将包括城市的事件。

这两个条件有效，但第三个条件不行

<div class="modal" id="modal-name">
    <div class="modal-sandbox">&nbsp;</div>
    <div class="modal-box">
        <div class="modal-header">
            <h3>Events</h3>
        </div>
        <div class="modal-body">
            <div class="event-list">&nbsp;</div>
            <div id="#eventdetails" class="order-details-table">&nbsp;</div>
        </div>
    </div>
</div>

<div id="calendar">&nbsp;</div>
<hr class="calendar">

<select id="search" class="modal-trigger" name="search" data-modal="modal-name">
    <option selected="selected" value="select">Select an Event</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="all">All</option>
</select></p>

<select id="searchcity" class="modal-trigger" name="searchcity" data-modal="modal-name">
    <option selected="selected" value="select">Search a City</option>
    <option value="City1">City1</option>
    <option value="City2">City2</option>
    <option value="City3">City3</option>
    <option value="City4">City4</option>
    <option value="City5">City5</option>
</select>
<button id="searchnow">Search</button>

2. 这是 Jquery 的代码，我希望当他们选择上面的值时会出现结果

JSON文件

   {
        "title": "Tasting Festival",
        "start": "start date",
        "tags": "1",
        "imageurl": "",
        "products": [
          {
            "name": "City 1",
            "url": "",
            "time": "",
            "location": ""
          },
          {
            "name": "",
            "url": ",
            "time": "",
            "location": ""
          }

        ]
      }
$("#searchnow").click(function () {
    var selectedCity = $("#searchcity").val();
    var selectedEvent = $("#search").val();
    $.getJSON('events.json', 
        function (data) {
            render(selectedCity, selectedEvents, data);
        });
    });


      function render(selectedCity, selectedEvent, data) {
    $(".order-details-table").empty();

     $(data).each(function (i, v) {  
        if(v.products)
         $(v.products).each(function(index,p){

                    if (selectedCity == 'all' || p.name == selectedCity)  {

                                    $(".order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');


                                } if (selectedEvent == v.tags && selectedCity == p.name ){
                    $(".order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');

            }  if (selectedEvent == 'all' || v.tags == selectedEvent)  {

                                    $(".order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');



                                }
     });  
});
}

标签： jqueryfullcalendar