【问题标题】:fullcalendar bootstrap modal with external event data具有外部事件数据的全日历引导模式
【发布时间】:2014-01-16 12:20:00
【问题描述】:

我正在使用带有 asp.net MVC 5 应用程序的完整日历。

当我在空白处单击 a 时,我会看到一个用于创建事件的模式视图。这很完美。

当我点击一个事件时,我想获取事件数据以及其他一些数据,然后只是开始日期结束日期和描述。

我有以下几点:

eventRender: function (event, element) {
                var id = event.id;
                element.popover({
                    placement: 'top',
                    html: true,
                    content: '<button id="customers" class="btn btn-default" onclick="KlantenModal(' + id + ')">Klant overzicht</button>',
                    animation: true
                });
            }

调用模态的函数。

function KlantenModal(event) {
        $('#klanten #eventId').val(event);
        $('#klanten').modal('show');
    }

和引导模式:

<div class="modal fade" id="klanten" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">Klanten</h4>
            </div>
            <div class="modal-body">

               /* here I want some Data eg. names of customers */

                 <input type="hidden" id="eventId" name="eventId" />


            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="submit" class="btn btn-primary"></button>
            </div>

    </div>
</div>

【问题讨论】:

  • 当您单击它或单击一个空的日历单元格时,您想从先前呈现的事件中获取数据,并且当弹出窗口出现时您想将不同的东西加载到事件属性中?当您在日历上呈现事件时,您可以为每个事件设置您的个人字段,这可能是您从事件中获取不同数据的方式。检查此 lick 的底部是否有非标准字段。 --> non-standardfieds
  • 当我点击它时,我想从以前呈现的事件事件中获取数据。该活动有 1 位或更多客户,我想以模态形式向他们展示。

标签: javascript asp.net asp.net-mvc twitter-bootstrap fullcalendar


【解决方案1】:

如果我理解你,你唯一需要做的就是像这样向事件添加字段:

在您的代码中某处用不同的客户填充一个数组并将该数组添加到事件属性中

    var customers = [];
    customers.push("im customer x");
    customers.push("im customer y");
    ...
events:[ 
        {
         'start': 2013-12-30,
         'end': 2013-12-30,
         'allDay': true,
         'customers': customers
        }

当您点击事件并访问事件字段时,您将获得包含当天客户的客户字段。

【讨论】:

  • 你能在全日历事件中添加额外的字段吗?我认为只有完整日历的字段是可能的。
  • 是的,您可以使用 allardsoeters ;) 检查有关非标准字段的完整日历文档,我在那里发布了一个链接。如果您认为我的回答正确,请为正确的回答投票。
  • 答案正确但不完整。您不能将对象作为参数传递,对吗?如何将事件传递给函数?或者对于弹出按钮有更好的解决方案。
  • 您可以将“事件”对象传递给您的函数。检查这个在 SO link
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-07-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-06-25
相关资源
最近更新 更多