javascript - 完整日历选择选项值以在日历下方呈现列表

Question

我想添加一些功能，其中当您选择事件选项事件时，它将在日历下方呈现一个列表，我在日历中已经有工作 eventclick 图标，每次您单击日历中的事件日期时，列表将出现在下方日历。我想添加一些过滤器功能，例如选择选项，当您更改它时，所有事件的列表将出现在同一类“订单详细信息表”中。我已将 events_selector 引用存储为事件中的“标签”。

<select id="event_selector"> 
  <option value="all">All</option>
  <option value="whiskey">Whiskey</option>

</select>
<div id="#eventdetails" class="order-details-table">&nbsp;</div>

    events:[

     title: 'Event Name',
     tags:'whiskey',
     products:
        [
          {
          name:'Event Place',
          url:'',
          time:'Sept. 15 | 12:00 PM',
          location:'TBA'

          }

        ]

  },

  ]


  $('event_selector').change(onSelectOpenList);
  function onSelectOpenList(){
    return['all', event.tags].indexOf($('#event_selector').val());

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

      $("html, body").animate({ scrollTop: $(".calendar").offset().top }, 1500);

      $(".order-details-table").empty(); // Clear list of products
      for (var i = 0; i < calEvent.products.length; i++) {
        insert(calEvent.title, calEvent.products[i].name, calEvent.products[i].url,  calEvent.products[i].time,  calEvent.products[i].location, calEvent.tags);
      }

};

标签： javascriptjqueryfullcalendar