如何获取对象的参数进行编辑

时间:2014-12-19 16:27:10

标签: javascript ruby-on-rails fullcalendar bootstrap-modal

我遇到了DateTime attribue的问题。问题是我已经创建了一个模态引导来编辑我在Fullcalendar中的事件。当我点击事件时,它会出现一个包含编辑事件的表单的模态。问题是我不知道如何获得我点击的事件的参数。我告诉你表单,控制器,视图和javascript。

javascript代码(Fullcalendar)在eventClick中我传递了该控件的url。

function drawControl(controls) {
        console.log(controls[0])

        $('#calendar').fullCalendar({
            editable: true,
            aspectRatio: 1,
            contentHeight: 500,
            scrollTime: '24:00:00',
            minTime: '01:00:00',
            maxTime: '24:00:00',
            defaultView: 'agendaWeek',
            header:{left:"prev,next,today",
            center:"title",
            right:"month, agendaWeek, agendaDay"},



            events: allControls(controls),

            eventRender: function(event, element) {

                var bloodLevel=event.title

                if(bloodLevel >= 180) {
                    element.css('background-color', 'red');
                }
                else if(bloodLevel < 70) {
                    element.css('background-color', 'yellow');
                }
            },
            eventClick: function(calEvent, jsEvent, view) {

                $('#modalTitle').html(calEvent.title);
                $('#modalDate').html(calEvent.start);
                $('#modalBody').html(event.description);
                $('#eventUrl').attr('href',"/users/:user_id/controls/calEvent.id/edit");
                $('#fullCalModal').modal();
            } //....

_form_edit.erb在form_edit中,我默认传递@control_day,即该事件的DateTime

<div class="">
<%= form_for [@user, @control], :html => {:class => ''} do |f| %>
    <p class="new_control_text">Edit Control</p>
      <div class="form-group">
        <div class="input-group">
          <%= f.label :level, class: "sr-only", for: "exampleInputEmail2" %>

          <%= f.number_field :level, class: "form-control", id: "exampleInputEmail2", placeholder: "Enter level" %>

        </div>
      </div>

      <div class="form-group container">
        <div class="row datetimeselect">
            <div class='col-sm-12'>
                <div class="form-group">
                    <div class='input-group date' id='datetimepicker2'>

                        <%= f.text_field :day, default: @control_day, :class => 'form-control' %>
                        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                        </span>
                    </div>
                </div>
            </div>
         </div>
     </div>

    <div class="select_period">
       <%= f.select :period, options_for_select([['pre-breakfast'], ['post-breakfast'],['pre-lunch'],['post-lunch'],['afternoon'],['pre-dinner'],['post-dinner']]), {}, class: "form-control" %>
    </div>      

      <%= f.submit "Save", type:"submit", class: "btn btn-default button-save" %>

<% end %>
</div>

index.html.erb

<div id="fullCalModal" class="modal fade">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span> <span class="sr-only">close</span></button>
            <h4 id="modalTitle" class="modal-title"></h4>
        </div>
        <div id="modalBody" class="modal-body">
          <%= render 'form_edit' %>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button class="btn btn-primary"><a id="eventUrl" target="_blank">Event Page</a></button>
        </div>
    </div>
</div>

controlsController.rb听到我将datetime转换为DateTimepicker格式

def edit
    @user = current_user
    @control = Control.find(params[:id])
    @control_day = @control.day.strftime('%m','%d','%Y','%I','%M','%p')
end

1 个答案:

答案 0 :(得分:0)

您检查了文档并查看了事件对象中的内容吗? 例如:calEvent.start是一个时刻对象,因此将其设置为模态上的HTML可能不是你想用它做什么。

查看momentjs文档,了解如何使用calEvent.start.format()或其他功能。