2015-12-14 14 views
6

Tôi muốn thay đổi kích thước một sự kiện trong fullcalendar bằng meteorj. Tôi muốn khôi phục ngày trong đầu vào để đặt kích thước. Tôi đã thử rất nhiều thứ như mã tiếp theo nhưng nó đã thất bại.Meteor js và fullcalendar

Tôi cũng muốn định dạng ngày theo "dd-mm-yy".

Cũng vui lòng giải thích cách sử dụng vai trò alaning bên trong tệp js của tôi để ngăn người dùng có sự kiện nhấp chuột.

Cảm ơn sự giúp đỡ của bạn.

tệp .html của tôi:

<template name="planning"> 
 
\t {{#if isInRole 'view-projects,prof,admin'}} 
 
\t {{>dialog}} 
 
    <div class="container"> 
 
     <div id="calendar"> 
 
     </div> 
 
    </div> 
 
\t \t {{/if}} 
 
</template> 
 
<template name="dialog"> 
 
<div class="modal" id="EditEventModal" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true"> 
 
<div class="modal-dialog"> 
 
    <div class="modal-content"> 
 
    <div class="modal-header"> 
 
     <button type="button" class="close closeDialog" data-dismiss="modal" aria-hidden="true">&times;</button> 
 
     <h4 class="modal-title" id="">Modification evenment</h4> 
 
    </div> 
 
    <div class="modal-body"> 
 
     <div class="form-group"> 
 
     <label for="title">Nom du projet</label> 
 
     <input type="text" class="form-control" id="title" placeholder="" value="{{title}}"> 
 
     </div> 
 
    </div> 
 
\t \t <form class="form-inline" role="form"> 
 
    <div class="form-group"> 
 
     <label for="dateSart">Début:</label> 
 
     <input type="text" name="anniversaire" class="form-control" id="dateStart" placeholder="" value="{{start}}"> 
 
    </div> 
 
    <div id="rightDateEnd" class="form-group"> 
 
     <label for="dateEnd">Fin:</label> 
 
     <input type="text" name="anniversaire" class="form-control" id="end" placeholder="" value="{{end}}"> 
 
    </div> 
 
    </form> 
 
    <div class="modal-footer"> 
 
     <a href="#" class="btn btn-danger remove">Delete</a> 
 
\t \t \t <a href="#" class="btn btn-primary updateTitle updateDateEnd">Save</a> 
 
\t \t \t <button type="button" class="btn btn-default closeDialog" data-dismiss="modal">Close</button> 
 
    </div> 
 
    </div> 
 
</div> 
 
</div> 
 
</template>

client.js tập tin của tôi:

Template.dialog.events({ 
 
    "click .closeDialog": function(event, template){ 
 
     Session.set('editing_event', null); 
 
    }, 
 
    "click .updateTitle":function(evt, tmpl){ 
 
     var title = tmpl.find('#title').value; 
 
     Meteor.call('updateTitle', Session.get('editing_event'),title); 
 
     Session.set('editing_event', null); 
 
     $('#EditEventModal').modal("hide"); 
 
    }, 
 
    "click .remove":function(evt, tmpl){ 
 
     Meteor.call('removeCalEvent', Session.get('editing_event')); 
 
     Session.set('editing_event', null); 
 
     $('#EditEventModal').modal("hide"); 
 
    }, 
 
    "click .updateStart":function(evt, tmpl){ 
 
     var start = tmpl.find('#start').value; 
 
     Meteor.call('updateStart', Session.get('editing_event'),start); 
 
     Session.set('editing_event',null); 
 
    }, 
 
    "click .updateEnd":function(evt, tmpl){ 
 
     var end = tmpl.find('#end').value; 
 
     Meteor.call('updateEnd', Session.get('editing_event'),end); 
 
     Session.set('editing_event',null); 
 
    } 
 
    }); 
 
    Template.planning.helpers({ 
 
    editing_event:function() 
 
    { 
 
     return Session.get('editing_event'); 
 
    } 
 
    }); 
 
    Template.dialog.helpers({ 
 
    title:function(){ 
 
     var ce = CalEvent.findOne({_id:Session.get('editing_event')}); 
 
     return ce.title; 
 
    }, 
 
    start:function(){ 
 
     var ce = CalEvent.findOne({_id:Session.get('editing_event')}); 
 
     return ce.end; 
 
    }, 
 
    end:function(){ 
 
     var cend = CalEvent.findOne({_id:Session.get('editing_event')}); 
 
     return cend.end; 
 
    } 
 
    }); 
 

 

 
    Template.dialog.rendered = function() 
 
    { 
 
    if(Session.get('editDialog')) 
 
    { 
 
     var calevent = CalEvent.findOne({_id:Session.get('editDialog')}); 
 
     if(calevent) 
 
     { 
 
     $('#title').val(calevent.title); 
 
     $('#start').val(calevent).start; 
 
     $('#end').val(calevent).end; 
 
     } 
 
    } 
 
    $('#end').datepicker(); 
 
    $('#dateStart').datepicker(); 
 
    } 
 

 
    Template.planning.rendered = function() 
 
    { 
 
    var calendar = $('#calendar').fullCalendar({ 
 
     dayClick:function(date, allDay, jsEvent, view){ 
 
     var calendarEvent = {}; 
 
     calendarEvent.start = date; 
 
     calendarEvent.end = date; 
 
     calendarEvent.title = 'Nouveau Projet'; 
 
     calendarEvent.owner = Meteor.userId(); 
 
     Meteor.call('saveCalEvent', calendarEvent); 
 
     }, 
 
     eventClick:function(calEvent, jsEvent, view){ 
 
     Session.set('editing_event',calEvent._id); 
 
     $('title').val(calEvent.title); 
 
     $('#EditEventModal').modal("show"); 
 
     }, 
 
     eventDrop:function(reqEvent){ 
 
     Meteor.call('moveEvent', reqEvent); 
 
     }, 
 
     events:function(start, end, callback){ 
 
     var calEvents = CalEvent.find({}, {reactive:false}).fetch(); 
 
     callback(calEvents); 
 
     }, 
 
     editable:true, 
 
     selectable: true 
 
     formatDate: 
 
    }).data().fullCalendar; 
 
    Deps.autorun(function(){ 
 
     CalEvent.find().fetch(); 
 
     if(calendar){ 
 
     calendar.refetchEvents(); 
 
     } 
 
    }) 
 
    }

server.js tập tin của tôi:

if (Meteor.isServer) { 
 
    Meteor.startup(function() 
 
    { 
 
    Meteor.methods({ 
 
     'saveCalEvent':function(ce) 
 
     { 
 
     CalEvent.insert(ce); 
 
     }, 
 
     'updateTitle':function(id,title){ 
 
     return CalEvent.update({_id:id},{$set:{title:title}}); 
 
     }, 
 
     'removeCalEvent':function(id,tittle){ 
 
     return CalEvent.remove({_id:id}); 
 
     }, 
 
     'updateStart':function(id,start){ 
 
     return CalEvent.update({_id:id},{$set:{start:start}}); 
 
     }, 
 
     'updateEnd':function(id,end){ 
 
     return CalEvent.update({_id:id},{$set:{end:end}}); 
 
     }, 
 
     'moveEvent':function(reqEvent){ 
 
     return CalEvent.update({_id:reqEvent._id},{ 
 
      $set:{ 
 
      start:reqEvent.start, 
 
      end:reqEvent.end 
 
      } 
 
     }) 
 
     } 
 
    }) 
 
    }); 
 
}

Thx lần nữa giúp đỡ của bạn

Trả lời

0

Bạn đã cố gắng sử dụng .preventDefault().stopPropagation()?

+1

Đây phải là một nhận xét –

+0

Tôi đồng ý. Không thể làm điều đó với danh tiếng 36 của tôi mặc dù. –

0

Không có nơi nào tôi xem nó dưới dạng sự kiện gửi để event.preventDefault() không tạo sự khác biệt. Peddle Hawk Blog đã viết về việc sử dụng FullCalendar Tôi hy vọng nó hữu ích hơn: How to add fullcalendar in meteor

+1

Vui lòng giải thích thêm trong câu trả lời của bạn. liên kết là tốt khi bạn gọi chúng là giải thích thêm. câu trả lời phải là tính năng toàn vẹn. – Media

Các vấn đề liên quan