简体   繁体   中英

jquery ui dialog - button click event handlers

I'm a js noob. I'm using the jquery FullCalendar plugin which exposes an eventClick(calEvent, jsEvent, view) event which is called when you click on an event on the calendar. In my event handler I want to pop up a dialog asking if the user wants to edit just one occurrence of a recurring event or the whole event. The problem is that the button click handlers for THAT dialog need to have access to the calEvent variable, but I have to instantiate the dialog inside $(document).ready but outside of the eventClick function.

Here's my code so far:

$(document).ready(function() {
  $('#calendar').fullCalendar({
    events: getEvents,
    header: {
      left: 'title',
      center: 'prev,next',
      right: 'today month agendaWeek agendaDay'
    },
    theme: true,
    eventClick: function(calEvent, jsEvent, view) {
      if(calEvent.readOnly == true) {
        return;
      }
      if(calEvent.recurring) {
        if(calEvent.persisted) {
          editOccurrence(calEvent);
        } else {
          $("#edit_type_dialog").dialog("open");
        }
      } else {
        editEvent(calEvent);
      }
    }
  });

  $("#edit_type_dialog").dialog({
    modal:true,
    autoOpen: false,
    buttons: {
      All:function() {
        $(this).dialog("close");
        editEvent(calEvent);
      },
      This:function() {
        $(this).dialog("close");
        editOccurrence(calEvent);
      },
      Cancel:function() {
        $(this).dialog("close");
      }
    }
  });

  function getEvents(start, end, callback) {
    //get some events
  }

  function editEvent(calEvent) {
    alert("event edited");
  }

  function editOccurrence(calEvent) {
    alert("occurrence edited"); 
  }
});

So the question boils down to: how do I get the calEvent over to the button click event handlers in the edit_type_dialog from the eventClick function?

Here's what I did (not sure if it's recommendable, but it works):

1) Move the dialog instantiation into the eventClick method, thereby giving it access to the calEvent variable. 2) Outside the fullCalendar instantiation, but still within $(document).ready() I added $("#edit_type_dialog").hide()

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM