Два варианта выбора для получения результатов и одна кнопка поиска - PullRequest
0 голосов
/ 09 октября 2018

Я использую полный календарь в jquery для выбора и поиска событий. Я хочу, чтобы каждый раз, когда они нажимали кнопку, появлялся модал, поэтому, когда они выбирают событие или назначенный город, появляется результат.Это HTML, Вот условия:

  1. Поиск пользователя по городу: результат будет включать все города
  2. Пользователь будет искать событие: результат будет включать событие.
  3. Пользователь будет искать как город, так и событие: результат будет включать в себя событие с городом.

2 условия работают, но третье условие не будет

<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>
Это код для 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>');



                                }
     });  
});
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...